通过按钮点击事件实现一个页面获取多个echarts图表

        最近导师让完成一个任务，任务的大概内容是，5个按钮分别是1-5号，还有另外两个按钮是最近5小时和最近24小时，通过点击按钮实现动态的从后台获取符合条件的数据，并展示在前端echarts里面，当时接到这个任务之后脑子是比较蒙的，后来经过了大概一周的研究终于搞定了，在此做个记录，也是为了给大家分享一下整体的思路。先把截图奉上，大家带着问题去看！有问题留言即可！

1号最近5小时的数据：

1号最近24小时的数据：

        在此说明一下，横坐标和纵坐标的值都是通过后台从数据库里读取出来的，而且eachers图是动态的，不是静止不动的，这只是截图原因。

 我的心路历程：

我拿到这个任务的时候一开始的需求是是要静态的，并且是要4个一条线的图，所以我的第一想法和大家是一样的去官网上贴代码，然后改样式，这样想想也挺简单，我大致的说一下，照顾一下初学者；

Apache EChartsECharts, a powerful, interactive charting and visualization library for browserhttps://echarts.apache.org/zh/index.html大家可以从上面的链接上面选则自己想要的图表类型，然后cv代码就可以了，so easy,你只需要自己根据自己的需求创建div和设置样式即可。

        接下来我具体的描述下我的最终成果是怎么实现的，主要是思路：具体代码我就不贴了，需要的下面留言即可。

第一步，我们需要从官网上找一个有3条折线图的图表。

第二步，我们需要让横坐标动起来。

第三步，我们需要实现从后端获取数据。(这一步需要你会建数据库，目的是后续怎么方便查数据更方便)

第四步，我们需要通过按钮的点击事件绑定我们的数据是属于几号按钮的数据，就是说你点击哪个按钮只能获取到符合当前条件的数值。

第五步，我们需要给控制时间的按钮也绑定上点击事件，类似于条件查询。

第六步，我们需要给两个时间的div设置显示和隐藏。

        由于篇幅原因，我就不粘代码了，以上的六步操作大家有不懂的可以在下面给我留言，我看到后会立马给大家解答，我也可以进一步的巩固。