前言¶
在 DeepSeek Harness(DSH)里,模型经常用 Markdown 表格给出数字对比。肉眼逐格读 Revenue、Growth 一列,效率低,也容易漏掉量级差异。常见做法是再让模型调用绘图工具,或本地起一个图表服务——多一轮交互、占 token,有时还要审批构建脚本。
dsh-table-charts 走另一条路:页面里表格已经渲染好了,插件只在客户端读 DOM、在表格下方插入条形图卡片。不调用工具、不连服务端,历史消息里的表在打开会话时同样会补图。
下面介绍它是什么、怎么装、什么表会出图,以及有意不做的边界。
这是什么¶
dsh-table-charts 是 DSH 的客户端插件,维护者为 chandra447(Chandra Doredla)。源码与说明见 GitHub 仓库,社区目录页为 skillhub.cn 上的插件条目。
定位一句话:当对话中的 Markdown 表格「看起来像数值数据」时,在表格下方绘制最多 4 个数值列的条形图;原表文字不改写。实现为预构建的 client.js,约 11 KB 浏览器 JS,无 host 代码、无 npm 运行时依赖;安装时不跑 build,因此不会触发 DSH 的 allowBuilds 审批。
核心功能¶
安装并启用后,你会得到这些行为(均来自项目 README 与 package.json 中的 dsh.client 配置:platform: web,immediately: true):
- 表格下方多出一张条形图卡片,表格本体不变。
- 第一列作分类标签,第一列之后的列里,满足「多数单元格可解析为数字」的列会成为系列,最多 4 列并排。
- 条旁保留原始单元格文案,例如
$1.6k仍显示为$1.6k,而不是只显示解析后的数字。 - 跟随 DSH 主题:条形色块用
--dsw-alias-link,回退--dsw-alias-brand-primary;多系列用同色系浅档;卡片用主题 surface、边框 token。SVG 填色写 CSS 变量,切换深浅色时由浏览器重绘,无需额外 JS。 - 宽度按内容收束,不会在宽屏上拉满整行。
- 历史会话:打开旧对话时,其中的合格表格也会尝试出图(安装前模型已写出的表同样可读页面后绘制)。
与 Mermaid 类插件、dsh-svg-fences 不冲突:那些处理代码块;本插件只扫 <table>。
数值解析规则(节选):
| 单元格示例 | 解析结果 |
|---|---|
1,240 |
1240 |
$980 |
980 |
-12% |
-12(百分号去掉,不按比例除以 100) |
(30) |
-30 |
1.2k |
1200 |
3M / 2B |
3000000 / 2000000000 |
n/a、TBD、12 USD |
非数字 |
€、£、¥ 与 $ 类似。表头若整词匹配 year、date、id、#、no、number、index、rank、version(大小写不敏感),该列不参与作图;Revenue per year 这类复合表头不会被整条规则跳过。
安装与启用¶
插件以当前 DSH 进程的权限在浏览器侧运行。安装前如在意合规,可自行查看仓库源码与 MIT 许可证。
应用内:
- 打开 Plugins 窗口;
- 进入 Discover;
- 搜索
dsh-table-charts并安装。
终端(按你实际使用的 profile):
dsh plugin --profile web add dsh-table-charts
dsh plugin --profile desktop add dsh-table-charts
卸载时将 add 改为 remove。
npm 包名为 dsh-table-charts,当前 README 附带版本徽章;package.json 中 engines.node 为 >=22.19.0(面向包开发与 CI),实际运行的是浏览器里的 client.js。README 写明在 macOS 上于 DeepSeek Harness 0.2.x 做过测试,其他平台未声明测试。
禁用插件后,条形图卡片会消失,消息与表格内容不被插件修改。
典型用法¶
模型(或你)在对话里写下带数值列的 Markdown 表即可,无需额外指令或工具调用。README 示例:
| Region | Revenue | Growth |
| ------ | ------- | ------ |
| North | $1,240 | 12% |
| South | $980 | -4% |
| East | $1.6k | 21% |
| West | (30) | n/a |
渲染后:表仍在;其下卡片含 Revenue、Growth 两个系列。(30) 按 -30 参与长度;n/a 在对应条的位置显示文字而非条。
出图条件概括:
- 至少 2 行表体、至少 2 列;
- 除第一列外,至少一列有 ≥60% 单元格可解析为数字;
- 表体不超过 24 行;无合并单元格(
colspan/rowspan整表跳过)。
不出图或故意不收手的情况包括:纯文字表、过小表、超长表、嵌套表、流式输出时表格尚未稳定(约 450 ms 防抖后再画;表变更会重画)、标识类/全零列等。README「When it stays out of the way」一节有完整列表。
适用场景与注意¶
更适合:
- 在 DSH 里快速对比区域销量、指标涨跌等多行数值表;
- 不想为每张表多要一轮绘图工具或维护本地 chart server;
- 需要深浅色主题下与界面一致的简单条形对比(列内比大小,不是多列统一尺度)。
需要知晓的限制(插件自述,非缺陷清单):
- 仅条形图:无折线、饼图、坐标轴、tooltip、可配置项。
- 每个系列按该列最大值单独缩放,条长只在列内比较行,不宜跨列读绝对比例。
- 负数条长按绝对值画,标签保留负号,条不反向伸出。
- 不支持欧洲小数写法
1.240,50、空格千分位1 240等作为数字。 - 是否出图靠启发式规则;不满足 60% 数字列等条件时保持沉默。
实现上,用 MutationObserver 监听 DOM,变更后约 120 ms 内重扫;每个表按文本内容 keyed 的 450 ms 稳定计时。图表为原生 SVG,textContent 写入单元格文案以降低注入风险。表被移除时,下次扫描会删掉对应卡片。
结尾¶
dsh-table-charts 把「表格已经在页面上」当作唯一数据源,用客户端条形图补一眼可视对比:无工具调用、无服务端、历史消息可补图。若你需要 SVG 代码块渲染,同一作者还有 dsh-svg-fences,架构类似(预构建 client.js、无依赖)。