做可視化的朋友，對 ECharts 應(yīng)該都很熟。這個從 2013 年就開始開源的圖表庫，不知不覺已經(jīng)陪伴我們 12 年了。從最基礎(chǔ)的柱狀圖、折線圖，到各種炫酷的大屏交互，它幾乎什么都能做。

昨天，ECharts 正式發(fā)布了 6.0 版本。這不是簡單的“修修補補”，而是一波比較大的升級，不管你是老用戶還是剛接觸，看看這次更新可能對你有幫助。

圖表更養(yǎng)眼了：視覺樣式全面優(yōu)化

ECharts 6.0 對默認視覺樣式做了大幅調(diào)整。不是那種“調(diào)了幾個顏色值”的小改，而是整體配色更現(xiàn)代、布局更舒服了。

最明顯的一點是，圖例現(xiàn)在默認放到底部，不會再跟圖表擠在一塊兒。整個畫面看起來更清爽，信息層級也更清晰，特別是內(nèi)容多的時候，觀感提升蠻明顯的。

圖片

圖片

支持主題動態(tài)切換

以前想換個主題，基本要重新 setOption，甚至要重新渲染圖表，挺麻煩的。

ECharts 6.0 新增了 chart.setTheme() 方法，直接一行代碼就能動態(tài)切換主題，連圖表都不用重畫。你可以預設(shè)多個主題，也可以傳入一個自定義的主題對象，非常方便。

圖片

白天用亮色、晚上用暗色？現(xiàn)在做起來輕松多了。

散點圖支持抖動：密集數(shù)據(jù)不再重疊成一坨

散點圖里數(shù)據(jù)點密的時候，很容易擠在一塊兒，看不清楚誰是誰。6.0 現(xiàn)在支持“智能抖動”，可以自動微調(diào)點的位置，保留原始坐標的同時提升可讀性。

圖片

還可以開啟 jitterOverlap 模式，讓點之間盡量避免互相遮擋?？雌饋碛悬c像“蜂群圖”，密集但不會亂。

圖片

和弦圖登場，復雜關(guān)系一圖搞定

這次新加的圖表類型是 和弦圖。它專門用來展示“誰跟誰有關(guān)系”這種數(shù)據(jù)，比如城市遷移、部門之間的資金流、社交網(wǎng)絡(luò)里的互動等等。

ECharts 用環(huán)形布局和線條連接來表現(xiàn)這些關(guān)系，展示效果還是挺直觀的。

圖片

坐標軸斷點：處理極端值更優(yōu)雅了

如果你畫圖時碰到異常值，比如一個點特別高，會把整個圖拉得很扁，其他數(shù)據(jù)都擠一塊兒去了。

現(xiàn)在可以在坐標軸上設(shè)置“斷點”，把極端值單獨顯示在一個區(qū)間內(nèi)，既能保留這類數(shù)據(jù)，又不會影響整體的可視性。這在做監(jiān)控、統(tǒng)計分析時特別實用。

圖片

矩陣坐標系：畫布可以像拼圖一樣自由組合

ECharts 6.0 引入了“矩陣坐標系”這個新東西。簡單說，就是你可以把畫布劃成多個格子，每個格子里放一個圖表，像搭積木一樣。

以前做對比分析或者儀表盤，要搞多個實例、手動排版，現(xiàn)在用這個會方便很多。而且它不僅能展示多個圖表，還能讓它們聯(lián)動起來。

圖片

標簽防溢出：再也不用手動調(diào)位置了

之前在小屏或空間緊張的時候，坐標軸標簽經(jīng)常出現(xiàn)重疊、出界的情況，看起來很亂。

ECharts 6.0 增加了防溢出機制，會自動判斷空間，動態(tài)調(diào)整標簽顯示的位置或角度，不用你再手動調(diào)整了。

• 之前：

圖片

• 現(xiàn)在：

圖片

標記系統(tǒng)升級：不再擔心被遮住

markPoint、markLine、markArea 等標記元素，現(xiàn)在可以設(shè)置圖層順序（z 和 z2），確保它們不會被主圖形“蓋住”。

另外新加的 relativeTo 屬性，也讓標記更好定位，能相對于某個圖形自動吸附，邏輯更直觀，寫法也更清晰。

自定義系列更強了：寫法靈活，交互更細

ECharts 的自定義系列功能一直挺強的，這次在 6.0 又做了一波增強：

• 自定義渲染邏輯現(xiàn)在可以寫成復用組件，不用每次重復代碼。
• 支持 compoundPath，可以畫更復雜的組合圖形。
• 加了 tooltipDisabled，可以控制哪些圖形需要交互，哪些不需要，整體體驗更專業(yè)。

寫在最后

ECharts 6.0 不是對 5.x 的小改，而是一次從視覺到底層的全面升級。如果你還在用老版本，建議抽空試試這個新版本。

新特性不少，兼容性也有變，老項目升級要稍微謹慎點，但如果你是新項目，6.0 的整體開發(fā)體驗和能力確實比以前舒服很多。