dsh-mermaid-zoom
Mermaid diagram zoom/pan/reset/PNG-copy enhancement plugin for DeepSeek Harness (DSH) web GUI
- Stars
- 0
- Language
- JavaScript
- Created
- Aug 19, 2026
- Updated
- Aug 19, 2026
Introduction
dsh-mermaid-zoom
Mermaid 图交互增强插件,适用于 DeepSeek Harness (DSH) Web GUI。
给 GUI 中 dsh-genui 渲染的 mermaid 图([data-genui-mermaid] 容器)加上:
- 🔍 Ctrl/Cmd + 滚轮缩放(不干扰页面正常滚动)
- ✋ 拖拽平移
- 🖱 双击重置视图
- 🧰 hover 工具栏:+ 放大 / - 缩小 / ⟳ 重置
- 📋 复制图片:导出 2x 白底 PNG,剪贴板优先,失败自动下载
纯浏览器端 DOM 增强,不依赖任何宿主服务;MutationObserver 自动接管流式渲染完成的图。缩放范围 0.4x – 10x。
安装
在 DSH web profile(如 ~/.dsh/profiles/web)中安装:
pnpm add dsh-mermaid-zoom
然后在 cordis.patch.yml 中插入:
- insert:
- id: dsh-mermaid-zoom
name: 'dsh-mermaid-zoom'
重启 dsh web 生效。
开发
git clone https://github.com/evanfang0054/dsh-mermaid-zoom.git
cd dsh-mermaid-zoom
npm test # node --test tests/
结构:
lib/index.js— 宿主半身(无操作,能力全在客户端)lib/client.js— 客户端半身(DOM 增强、事件绑定、PNG 导出)lib/core.mjs— 纯逻辑核心(不触碰 DOM,可被node --test直接测)