折线图图怎么做

中建一局三公司2022-06-19  21

如何用Echarts制作标准折线图

我们经常使用Echarts制作各种图表,那么如何使用Echarts制作标准折线图呢?下面小编给大家展示一下。

操作方法 01

首先打开Sublime Text软件,新建一个HTML文档,将下图所示的HTML结构添加到文档中。

02

接下来,使用scripts标签将echarts的库文件引入HTML,如下图所示。

03

然后我们在body标签中创建一个div区域来存储折线图,如下图所示。注意设置div的高度。

04

接下来,我们通过echarts的init方法初始化刚刚创建的div区域,如下图所示。

05

然后我们设置折线图的参数,包括X,Y坐标轴数据,折线图标题等信息,如下图所示。

06

接下来在series参数中设置折线图需要的数据,如下图所示,一条折线配置一个花括号。

07

设置好参数和数据后,我们调用echarts的setOption方法将内容填充到折线图显示区,如下图所示。

08

最后,当我们运行HTML文件时,我们可以看到如下图所示的标准折线图。单击顶行标题隐藏或显示该行。

转载请注明原文地址:https://juke.outofmemory.cn/read/373120.html

最新回复(0)