如何用Echarts製作標準折線圖

我們經常使用Echarts製作各種圖表，那麼如何運用Echarts製作標準折線圖呢？下面小編給大家演示一下。

操作方法

首先開啟Sublime Text軟件，新建一個HTML文檔，並在文檔中添加如下圖所示的HTML結構

接下來運用scripts標籤在HTML中引入echarts的庫檔案，如下圖所示

然後我們在body標籤中創建一個div區域用來存放折線圖，如下圖所示，注意給div設定高度

接下來我們透過echarts的init方法對剛纔創建的div區域進行初始化，如下圖所示

然後我們設定折線圖的參數，包括X，Y座標軸數據，折線圖標題等資訊，如下圖所示

接下來在series參數中設定折線圖所需要的數據，如下圖所示，一條折線配置一個大括號

參數和數據設定完畢以後我們調用echarts的setOption方法將內容都填充進折線圖展示區域，如下圖所示

最後我們執行HTML檔案，就可以看到如下圖所示的標準折線圖了，點擊頂部的折線標題可以隱藏或者顯示折線