html折线图多组数据,Highcharts 实现HTML页面多个折线图

前言

最近做项目的时候，产品说要在后台的首页放多折线图(不是多数据折线图)，但我上去网上找，基本是多数据折线图。例如：

同时换关键字也没什么可参考的。

多折线图实现

找不到参考的，只能自己摸索。于是尝试将呈现折线图的HTML内容复制一遍。结果是——只显示一个折线图，控制台没有报错。

开始有些思路，产生问题的原因可能是：

一、数据没有传过来；

二、数据绑定的问题；

三、一二问题同时有。

最后发现一开始的HTML结构出现问题，导致后续的数据绑定出现问题。

highcharts插件是通过绑定id，并将数据渲染到对应id的容器中。highcharts的官方文档实例不太明显，走了一小段弯路。