學習來源：如何挑選數(shù)據(jù)可視化框架及平臺 - 前端篇

? ? ? ? ? ? ? ? ?數(shù)據(jù)可視化分析

可視化庫：D3可視化界的jQuery，ECharts窮人的Highcharts，Highcharts小鎮(zhèn)里的世界級組件，Vega圖表也能低代碼，Ｇ2/F2《The Grammar Of Graphics》的追隨者，Chart.js頂級推廣案例，AnyChart悶聲賺錢的圖表庫，FusionCharts高中生的逆襲，amCharts唯一可以免費商用的商業(yè)圖表庫，Google Chart圖表庫的云服務(wù)。

雖然有很多開源圖表庫，但絕大部分不是已經(jīng)棄坑就是將要棄坑了，目前真正能用的就只有ECharts，Ploty.js，Vega，Ｇ2.

D3

D3最早出現(xiàn)在Mike Bostock讀博期間發(fā)表的一篇論文里，它的目的并不是做圖標庫，而是成為更低層的基礎(chǔ)設(shè)施，簡化數(shù)據(jù)可視化的開發(fā)，它在API設(shè)計方面參考了jQuery，使用，除了類似jQuery的鏈式調(diào)用，D3還有鮮明的特點是將功能拆得非常細，做到了函數(shù)級別，從數(shù)據(jù)解析，轉(zhuǎn)換到布局算法都有提供，這使得開發(fā)者可以十分靈活地進行組合，實現(xiàn)各種可視化的展現(xiàn)，這使得D3非常適合拿來學習的可視化算法，而且還能很方便地將這些算法整合到自己的項目中。

D3的鏈式調(diào)用既是優(yōu)點也是缺點，對于沒有學過D3的人會完全看不懂，即便學過看都要花不少精力，如果只是想繪制常見圖表，沒必要直接用D3.

D3的接口基于DOM，用來操作SVG沒問題，但不推薦直接用來操作Canvas和WebGL，這使得D3無法用于大數(shù)據(jù)量及需要像素級別操作的特效。

總的來說D3是一款成功的可視化基礎(chǔ)設(shè)施，它的源碼值得學習，但不推薦直接使用它例子開發(fā)圖表，一方面基于它寫的代碼上手門檻高，另一方面是它的定位并非圖標庫。

ECharts

百度商業(yè)前端團隊嘗試基于canvas來開發(fā)圖表庫ECharts，比起SVG/VML，canvas雖然調(diào)試麻煩，但在大量數(shù)據(jù)點下性能更好。中文文檔的優(yōu)勢。

Echarts有不少自己獨特的功能，其中最亮點的就是Echarts-gl（基于WebGl做的真三維，可以配置光照，材質(zhì)，陰影等，還有獨家的后期特效功能。），能實現(xiàn)三維圖表和地球的展示。

作為一個公司內(nèi)的開源產(chǎn)品，Echarts從功能和文檔方面都達到了商業(yè)產(chǎn)品的水平，還有主題編輯器和大量社區(qū)貢獻的案例，而且Echarts團隊在過去7年一直都有提交。

靠用戶貢獻的例子遠遠多于其他圖表庫，一定上緩解了API太多的學習成本，而且ECharts的Issues幾乎都有回復。趕上商業(yè)質(zhì)量的開源庫。

Gallery

Echarts4.0提供了canvas和svg兩種渲染方式，默認使用canvas渲染，而D3是以svg為主的。

總結(jié)

以上是生活随笔為你收集整理的echarts-学习笔记及扩展的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。