如何用Echarts制作標準折線圖
我們經常使用Echarts制作各種圖表，那么如何運用Echarts制作標準折線圖呢？下面小編給大家演示一下。
操作方式
-
01
起首打開Sublime Text軟件，新建一個HTML文檔，并在文檔中添加如下圖所示的HTML布局
-
02
接下來運用scripts標簽在HTML中引入echarts的庫文件，如下圖所示
-
03
然后我們在body標簽中建立一個div區域用來存放折線圖，如下圖所示，注重給div設置高度
-
04
接下來我們經由過程echarts的init方式對適才建立的div區域進行初始化，如下圖所示
-
05
然后我們設置折線圖的參數，包羅X，Y坐標軸數據，折線圖題目等信息，如下圖所示
-
06
接下來在series參數中設置折線圖所需要的數據，如下圖所示，一條折線設置裝備擺設一個年夜括號
-
07
參數和數據設置完畢今后我們挪用echarts的setOption方式將內容都填充進折線圖展示區域，如下圖所示
-
08
最后我們運行HTML文件，就可以看到如下圖所示的尺度折線圖了，點擊頂部的折線題目可以埋沒或者顯示折線
- End
- 發表于 2018-12-12 00:00
- 閱讀 ( 922 )
- 分類：電腦網絡
admin
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章