Nagi-ovo/dsh-visualize
在 DSH 对话中生成交互式可视化|Render model-generated interactive cards inside DSH conversations
已收录
171
Ui
Bundle 已验证
预览
功能介绍
对话内生成式 UI:模型把交互式 HTML 卡片直接画进会话流,带流式预览与沙箱渲染。
适合
- 在 Web UI 会话中用模拟器、图表、对比面板或 UI 原型比文字更清晰的工作流。
- 需要把模型生成的交互式 HTML 直接嵌入会话流的场景。
- 需要流式预览、可随会话重放且在沙箱 iframe 中隔离运行的卡片的用户。
不适合
- TUI 或 headless 客户端;这些客户端只会显示普通工具结果,不会渲染交互卡片。
- 需要卡片内按钮向主会话发送后续消息的交互;当前不支持该能力。
- 超过已配置大小上限,或需要任意网络访问、嵌套页面或表单提交的 HTML fragment。
README
dsh-visualize

简体中文 | English
让 DSH 不只回答一段文字。模型调用 visualize 后,Web UI 会在对话里直接出现一张可交互卡片,用来做模拟器、图表、对比面板或 UI mockup。
安装
推荐直接从 GitHub 安装到 DSH 的 web profile:
dsh plugin --profile web add github:Nagi-ovo/dsh-visualize
# 如果 dsh web 正在运行,重启后刷新页面
可以运行 dsh --profile web --dump-config 确认插件已经进入最终配置。需要修改源码时,克隆仓库并在仓库目录运行 dsh plugin --profile web add .;构建产物已经提交,不需要额外构建。使用社区 plugin-registry 的用户也可以从「设置 → 插件」安装。
怎么用
直接告诉模型你想看什么,例如「做一个能调参数的排序算法可视化」。模型会写出一份 HTML fragment,再调用 visualize(path, title?, mode?) 把它放进对话。适合并排比较的内容可以使用 mode: "wide"。
卡片会跟随 DSH 的明暗主题和鲸鱼蓝配色。会话重放时,页面从持久化的工具结果恢复,不依赖原始 fragment 文件仍然存在。
安全
卡片运行在不透明来源的 sandboxed iframe 中,不能接触宿主页面。CSP 会阻止网络请求、嵌套页面和表单提交,只允许从固定 CDN 加载静态资源。单个 fragment 默认上限为 1000000 字节,可以通过 maxFragmentBytes 调整。
限制
目前只在 Web UI 中渲染交互卡片,TUI 和 headless 客户端会显示普通工具结果。卡片内的按钮暂时不能向主对话发送 follow-up 消息。
灵感来自 Codex 桌面端的 /visualize;skill 的分层 reference 和 Chart.js 优先路线借鉴了 himself65/finance-skills。
常见问题常见问题
在启用了 DSH 的终端中执行已验证命令 dsh plugin --profile default add github:Nagi-ovo/dsh-visualize。命令会解析公开 package 元数据,并保持插件与本页展示的目录身份一致。
兼容性以页面上展示的 bundle 与 profile 状态为准。如果某个 profile 尚未检测到,请先保持禁用,并在生产启用前阅读仓库文档。
GitHub 链接和 activity 元数据是 release 与维护状态的来源。新版本发布后重新查看本页,确认目录已经观察到最新版本。
