前言¶
在 DeepSeek Harness (DSH) 插件開發中，展示智能體行爲或計算邏輯時，往往需要一個直觀、視覺化的 Demo。油車與電車的持有成本對比是一個常見話題，但手動製作交互圖表和動畫錄屏效率較低。下面介紹一個針對 DSH Better Sidebar 的插件 Demo，它將這一對比過程轉化爲可視化的動態演示。
這是什麼¶
這是一個爲錄屏演示設計的油車 vs 電車擁有成本對比插件，由開發者 Dongfang81 維護。它解決了展示覆雜數據對比時的視覺呈現問題，提供了可交互的參數調整和動畫結果。
核心功能¶
- 時間與里程控制：支持在 3、5、8、10 年之間快速切換，年裏程範圍可在 5,000 至 50,000 公里之間調節。
- 本地計算：所有成本數據在本地進行確定性計算，不依賴外部付費模型。
- 可視化展示：使用 SVG 繪製累計成本曲線，展示節省區間，並包含反轉年裏程和結果動畫。
- 語音講解：在支持
speechSynthesis的瀏覽器環境中，會播放中文講解；不支持時僅完成視覺演示。
安裝與啓用¶
確保已安裝 dsh-better-sidebar >= 0.12.2，然後進入插件目錄執行以下命令構建並安裝：
pnpm build
dsh plugin --profile web add .
dsh web
典型用法¶
啓動後，在 Better Sidebar 的 Tab 欄點擊 +，選擇「油電賬本」即可進入演示界面。
適用場景與注意¶
此插件適合開發者用於生成展示成本對比的錄屏素材，或作爲教學 Demo。由於是純客戶端計算，數據安全有保障。
需要注意的是，插件內的預置參數僅用於娛樂化演示，不構成真實的車輛價格或購買建議。安裝前請檢查源碼與許可證。
結語¶
該插件展示瞭如何利用 DSH 客戶端能力構建本地化的、確定性的數據可視化 Demo，適合作爲 Harness 生態中的示例參考。
