你有沒有過這種時候？手里攥著一堆 Excel 數據，想做個直觀的圖表給同事看，用 Excel 自帶的圖表吧，樣式丑不說，稍微復雜點的交互（比如點擊柱子顯示詳情）根本做不了；想自己用代碼寫吧，又得查半天 ECharts 或 Highcharts 的文檔，調樣式、改數據格式，折騰半小時還沒弄出滿意的效果 —— 尤其是趕項目進度的時候，光在圖表上耗時間，真的會讓人忍不住吐槽 “這破圖表比寫業務邏輯還煩”。

上次運營同事找我要一份 “近半年用戶注冊來源分布” 的圖表，要求能看每月數據對比，還得點擊某個來源能顯示具體城市數據。我一開始想自己用 ECharts 寫，結果查文檔調 x 軸標簽換行就花了 15 分鐘，后來小索奇突然想起 Github 上有個叫 ECharts Gallery 的項目，直接打開它的在線版，5 分鐘就搞定了 —— 你猜怎么著？上面全是現成的圖表模板，連 “帶鉆取功能的多維度柱狀圖” 都有，我只需要把 Excel 里的數據改成 JSON 格式粘進去，再調了下顏色和字體，直接導出 HTML 文件發給運營，她打開后還以為我花了半小時做的。

這個項目是 Apache ECharts 官方維護的，Github 地址是https://github.com/apache/echarts-gallery，不用下載安裝，直接訪問它的在線地址（從 Github README 里就能找到）就能用，完全免費。小索奇當時特意翻了翻它的模板庫，從基礎的折線圖、餅圖，到復雜的熱力圖、桑基圖、3D 地圖，甚至還有適合大數據展示的 “流圖”，足足有幾百個模板，覆蓋了大部分工作中會用到的場景 —— 比如做電商的同事要展示 “商品銷量 TOP10”，用它的 “橫向柱狀圖 + 排名標注” 模板，改改商品名和銷量數據就行；做后端的要監控服務器 CPU 使用率，用 “實時更新的折線圖” 模板，連定時器代碼都給你寫好了。

最方便的是它的 “代碼實時編輯” 功能。你選好模板后，左邊是代碼區，右邊是預覽區，改一行代碼，右邊立馬就能看到效果。比如我上次想給餅圖加個 “點擊扇區顯示百分比” 的功能，在左邊代碼里找到 “series -> label -> formatter”，把默認的 “{b}” 改成 “{b}: {d}%”，右邊預覽區的餅圖立馬就變了，根本不用自己搭開發環境。而且代碼里的注釋特別詳細，哪怕你沒怎么用過 ECharts，看注釋也能明白每個參數是干嘛的 —— 比如 “tooltip: { trigger: 'axis' }”，注釋里直接寫著 “鼠標懸浮時觸發提示框，按坐標軸觸發（適合折線圖 / 柱狀圖）”，新手也能輕松上手。

不過有個小地方得注意：它的在線版雖然方便，但如果要處理特別大的數據（比如超過 10 萬條），預覽區可能會有點卡頓，這時候可以把代碼復制到本地，用瀏覽器打開 HTML 文件運行，速度會快很多。小索奇上次處理 “全年用戶行為日志” 數據時就遇到過這個問題，后來把代碼下載到本地，加載速度立馬就上去了，而且功能一點沒受影響。

我之前也試過其他數據可視化工具，比如 Tableau，功能是強，但要收費，而且上手難度高；還有一些在線圖表工具，模板少不說，還不支持自定義代碼，想改個樣式都沒轍。相比之下，ECharts Gallery 既免費又靈活，既能滿足 “快速出圖” 的需求，又能支持深度定制，甚至你還能把自己做好的圖表模板上傳到上面，分享給其他開發者 —— 我上次就把 “帶環比增長標注的折線圖” 模板傳上去了，現在已經有幾百人用了，還收到了不少評論說 “這個模板解決了我的燃眉之急”，還挺有成就感的。

你們平時做數據可視化的時候，是自己寫代碼，還是用現成的工具？有沒有遇到過 “調了半天樣式，結果圖表還是丑得沒法看” 的情況？可以在評論區說說，咱們交流下怎么快速做出好看又實用的圖表～

對了，它的 Github 倉庫里還有 “新手入門指南”，里面教你怎么把圖表嵌入到項目里（比如 Vue、React 項目），甚至還有 “圖表性能優化技巧”，比如怎么處理大數據量、怎么減少頁面卡頓，有需要的朋友可以去看看。

我是【即興小索奇】，點擊關注，獲取更多相關資源