Echart可视化学习(八)

文档的源代码地址,需要的下载就可以了(访问密码:7567)
https://url56.ctfile.com/f/34653256-527823386-04154f

正文:

新增需求 点击 2020年 2021年 数据发生变化

在index.html中添加语句

Echart可视化学习(八)

在index.css中添加样式

Echart可视化学习(八)

查看效果

Echart可视化学习(八)

tab栏切换事件

点击2020按钮 需要把 series 第一个对象里面的data 换成 2020年对象里面data[0]

点击2020按钮 需要把 series 第二个对象里面的data 换成 2020年对象里面data[1]

2021 按钮同样道理

Echart可视化学习(八)

这段代码中的注释部分,最好试一下,在开发者工具台中查看,明白每句话的含义

Echart可视化学习(八)

以下是后台送过来数据(ajax请求过来的)

Echart可视化学习(八)

查看效果

Echart可视化学习(八)

其中点击2020和2021有所不同

Echart可视化学习(八)

可以更改series的代码

Echart可视化学习(八)

查看效果

Echart可视化学习(八)

 

上一篇:H3C SSH远程管理登录配置


下一篇:痞子衡嵌入式:MCUXpresso IDE下添加新路径下源文件进工程编译的方法