在頁(yè)面上嵌入圖表(如柱狀圖、餅圖、折線圖、儀表盤等)通常是為了更高效、直觀地傳達(dá)信息,尤其在數(shù)據(jù)密集的場(chǎng)景中。在軟件開(kāi)發(fā)的過(guò)程中,我們經(jīng)常會(huì)遇到需要對(duì)數(shù)據(jù)進(jìn)行可視化處理,那么我們?cè)撊绻麑?shù)據(jù)變成圖表呈現(xiàn)在頁(yè)面上呢?長(zhǎng)沙做軟件開(kāi)發(fā)的公司一步步帶你打怪升級(jí):
第二步:點(diǎn)擊快速入門,下載Echart.js文件
1.快速入門
2.查看入門指引
3.找到echart.js文件


4.按住Ctrl+s,保存echart.js文件到需要的文件夾
第三步:用Visual Studio Code打開(kāi)文件夾
1.打開(kāi)文件夾
2.新建HTML文件并引入echart.js
3.在繪圖前我們需要為ECharts 設(shè)置一個(gè)定義了高寬的DOM容器:
4.初始化echart實(shí)例
然后就可以通過(guò) echarts.init 方法初始化一個(gè) echarts實(shí)例并通過(guò)setOption 方法生成一個(gè)簡(jiǎn)單的柱狀圖,下面是完整代碼。

獲取用于顯示圖表的DOM,然后將配置的參數(shù)賦值給DOM
運(yùn)行頁(yè)面到瀏覽器,你就完成了你的用第一個(gè)圖表!

最后:Echart還有很多其它的圖表,鼓勵(lì)大家去嘗試生成不一樣的圖表!