前言¶

在 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）：

1. 表格下方多出一張條形圖卡片，表格本體不變。
2. 第一列作分類標籤，第一列之後的列裏，滿足「多數單元格可解析爲數字」的列會成爲系列，最多 4 列並排。
3. 條旁保留原始單元格文案，例如 $1.6k 仍顯示爲 $1.6k，而不是隻顯示解析後的數字。
4. 跟隨 DSH 主題：條形色塊用 --dsw-alias-link，回退 --dsw-alias-brand-primary；多系列用同色系淺檔；卡片用主題 surface、邊框 token。SVG 填色寫 CSS 變量，切換深淺色時由瀏覽器重繪，無需額外 JS。
5. 寬度按內容收束，不會在寬屏上拉滿整行。
6. 歷史會話：打開舊對話時，其中的合格表格也會嘗試出圖（安裝前模型已寫出的表同樣可讀頁面後繪製）。

與 Mermaid 類插件、dsh-svg-fences 不衝突：那些處理代碼塊；本插件只掃 <table>。

數值解析規則（節選）：

€、£、¥ 與 $ 類似。表頭若整詞匹配 year、date、id、#、no、number、index、rank、version（大小寫不敏感），該列不參與作圖；Revenue per year 這類複合表頭不會被整條規則跳過。

安裝與啓用¶

插件以當前 DSH 進程的權限在瀏覽器側運行。安裝前如在意合規，可自行查看倉庫源碼與 MIT 許可證。

應用內：

1. 打開 Plugins 窗口；
2. 進入 Discover；
3. 搜索 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、無依賴）。

• 目錄頁：https://www.skillhub.cn/plugins/chandra447/dsh-table-charts
• 源碼與文檔：https://github.com/chandra447/dsh-table-charts