ECharts.js 介紹
- ECharts，他是一個使用 JavaScript 的圖形庫
- 底層依賴繪圖引擎ZRender
ECharts.js 優點
- 容易上手：其語法類似 css 的參數配置型語法，學習門檻較低，且有中文文檔
- 在 ECharts 4.0 以後同時支持 Canvas / SVG 渲染
- 開源免費的純 JavaScript 圖形庫 可以 CDN 引入 ECharts js
script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.3.0/echarts-en.js"></script>
- 好看!!!
ECharts.js 缺點
- 自由度較差
- 代碼復用率低
ECharts.js 範例
vue-echarts
vue-echarts是封裝後的vue插件
與其他可視化庫比較
AntV G2
-
G2 (The Grammar of Graphics) 是一套基於可視化編碼的圖形語法
-
優點：
- 簡易性和靈活性高
-
缺點：
- 學習門檻較高，G2的定位不是一門開箱即用的框架
-
Highcharts
-
Highcharts是基於 SVG 的圖形庫
-
優點：
- 兼容性好，可兼容到 IE6
-
缺點：
- 要錢!
-
D3.js
-
D3 (Data-Driven Documents) 更接近底層，能直接操作 svg
-
優點：
- 掌握後，自由度極大
-
缺點：
- 學習門檻高
-
Thanks !
{"metaMigratedAt":"2023-06-15T00:53:38.996Z","metaMigratedFrom":"YAML","title":"ECharts.js","breaks":true,"slideOptions":"{\"theme\":null,\"transition\":\"fade\"}","contributors":"[{\"id\":\"98e5599d-e3ae-49c1-85db-8eee769779c0\",\"add\":4321,\"del\":2558}]"}