dsh-graphics:让 Agent 在工作区里画 Excalidraw,并把渲染图直接交给模型看

前言

在 DeepSeek Harness(DSH)里,如果希望模型产出示意图、线框或简单原型,常见做法是生成 SVG 或 Mermaid 文本。模型通常看不到最终渲染效果,用户也往往要另开工具核对。画布若只是会话里的字符串,也很难随项目进 Git、和代码一起版本管理。

下面介绍社区插件 dsh-graphics(维护者 JuerGenie,分类:客户端)。它把 Excalidraw 画布做成工作区里的 .excalidraw 文件,为 Agent 注册五个专用工具,并在 graphics_render 时把 PNG 以图像内容块回传给模型,使下一轮对话里模型能「看见」自己画的内容。DSH Web 界面还提供右侧栏 Excalidraw 编辑面板,供人工打开、编辑同一批文件。

这是什么

dsh-graphics 是 DSH 插件:工作区内的 Excalidraw 画布,配合 Agent 工具创建、读取、更新 .excalidraw,渲染 PNG 回传模型,并在 DSH Web UI 提供右侧栏编辑器。

它解决什么问题

插件 README 归纳的路径可以概括为四点:

  1. 画布是普通工作区文件(.excalidraw JSON),可用现有文件能力读写、纳入版本库。
  2. Agent 有专门的画图/读图工具,不必手写底层元素 JSON。
  3. 渲染图作为图像内容块回传,模型可在后续轮次根据画面自我修正。
  4. 可选导出 SVG 到工作区作交付或二次使用(PNG 经附件服务给模型,见下文限制)。

核心功能

Agent 工具

工具 作用
graphics_list 列出工作区内的画布
graphics_read 读取画布的结构化摘要(页面/元素/文字/关系),而非整份元素 JSON
graphics_create 从语义化描述创建画布
graphics_update 对已有画布批量增删改
graphics_render 渲染并把图回传给模型;可选把 SVG 导出到工作区

graphics_render 是闭环关键:经 attachments.saveImage() 登记 PNG 后,以 {type:'image', attachment} 内容块回传;若带 outputPath,会把 SVG 写入工作区。

Web 界面

在 DSH Web 中打开工作区里的 .excalidraw 文件,右侧栏会出现 Excalidraw 编辑面板,支持直接编辑并手动保存回原文件(带版本冲突保护:若文件已被 Agent 修改,保存会拒绝静默覆盖)。

编辑器工具栏提供「引用到输入框」,把当前画布路径插入会话,便于 Agent 使用 graphics_read / graphics_render。输入框的 + 菜单(与键入 / 相同)中有「画布」命令,可新建 graphics/canvas-<时间戳>.excalidraw 并在编辑器中打开。

安装与启用

安装由 DSH 的 plugin_manager 完成;README 要求不要手写 profile 的 package.json。官方示例命令如下(target 指向插件 bundle 所在目录,请换成你本机克隆或解压后的路径):

plugin_manager install_bundle  target=/Users/juergenie/Projects/Workspaces/dsh-graphics

清单中声明了 dsh.client(lib/client.js 与 editor/dist/ 构建产物)。README 强调:在 editor/dist/ 构建完成之前不要声明 dsh.client,否则 Web 启动审计会报激活失败。

若从源码分发或自研构建,需要先安装依赖并构建编辑器静态资源:

pnpm install
pnpm build:editor

editor/dist/ 约 21MB(含字体),不进版本库,发布时由 package.json 的 files 字段打包。

典型用法

给 Agent

在 live 会话中,五个工具已对模型可见。README 中的调用形态如下:

graphics_list                        列出工作区里的画布
graphics_create path=… elements=[…]  画一张画布(语义化元素,不用写底层 JSON)
graphics_read   path=…               读回结构摘要(含容器的绑定标签)
graphics_update path=… ops=[…]       批量增删改,一次落盘
graphics_render path=…               渲染并把图直接交给模型看

需要落盘矢量图时,在 graphics_render 上配合 outputPath 导出 SVG。

给人

在文件树中点开 .excalidraw,在右侧栏编辑;有未保存改动时工具栏会提示,点保存才写盘。人与 Agent 共用同一文件,避免「模型改了一版、人不知道」的静默覆盖。

适用场景与注意

适合:需要在 DSH 工作区内做线框、原型草图、简单示意图,且希望 Agent 能根据自己看到的渲染结果迭代;希望画布文件可版本管理、可人工精修的场景。

运行与信任:插件以当前 DSH 进程权限运行,可读写工作区、注册工具与客户端扩展。安装前请阅读 源码仓库 与 MIT 许可证,自行评估是否纳入你的 profile。

已知限制(摘自 README):

  • PNG 不能通过 ctx.fs 导出到工作区(变更操作仅支持 UTF-8 文本);PNG 走附件服务给模型,落盘用 SVG。
  • 宿主侧插件代码改动后需重启 DSH(profile 下 HMR 不监听源码模块)。
  • 编辑器 iframe 不继承宿主主题 token,初始主题跟随系统偏好。

生态说明:DSH 强调「一切皆插件」;SkillHub 等为社区目录站点,与 DeepSeek / 幻方无官方从属关系。

结尾

dsh-graphics 把 Excalidraw 画布、五个 Agent 工具与「渲染图回传模型」串成一条可验收的链路:文件在工作区、图在会话里可见、人在 Web 右侧栏可改同一源文件。进一步了解设计与验收细节,可参阅仓库内 docs/design.md、docs/plan.md。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

Xiaoye