千鋒教育-做有情懷、有良心、有品質(zhì)的職業(yè)教育機(jī)構(gòu)
echarts是一個(gè)基于JavaScript的開(kāi)源可視化圖表庫(kù),可以流暢的運(yùn)行在PC和移動(dòng)設(shè)備上,兼容絕大部分的瀏覽器(IE9/10/11,Chrome,F(xiàn)irefox,Safari等),底層依賴矢量圖形庫(kù)ZRender,提供20 多種圖表和十幾種組件,支持Canvas、SVG雙引擎并能一鍵切換,讓移動(dòng)端渲染更加流暢echarts源自百度,現(xiàn)由Apache 開(kāi)源社區(qū)維護(hù),官方提供了完善的文檔( https://echarts.apache.org ),使用也非常簡(jiǎn)單,步驟如下:
1. 下載echarts
- 從 GitHub 獲取 https://github.com/apache/echarts
- 從 npm 獲取 npm install echarts --save
- 從 CDN 獲取 https://www.jsdelivr.com/package/npm/echarts
- 在線定制 https://echarts.apache.org//builder.html
2. 引入echarts
3. 添加一個(gè)div容器并設(shè)置寬高
注意:不設(shè)置寬高無(wú)法顯示效果
4. 初始化一個(gè) echarts 實(shí)例并通過(guò) setOption 方法生成一個(gè)圖表(以柱狀圖為例)
上一篇
場(chǎng)景題:繪制曲線下一篇
小程序生命周期相關(guān)推薦