3步搞定复杂的ECharts可视化图表！

在网页中，我们经常会看到各种各样的图表，如气温变化图、商品销量统计图等。这些图表都是由Web前端开发人员来开发完成的，他们会从专业机构或网站后端服务器的API接口中调取数据，然后以图形的方式呈现出来。

2020年以来，新冠肺炎疫情已经成为了全世界共同关注的焦点。为了方便用户及时了解最新的疫情信息，许多网站都制作了疫情的相关图表，让我们看到疫情的走势信息。

对于一个Web前端的初学者来说，要完全靠自己实现这样一个复杂的图表，其实是很困难的。

实际上，许多网站的图表也不是完全从零开始开发的，而是基于各种图表库来开发的，如ECharts、Highcharts等。使用这些图表库可以快速帮我们生成整个图表，而我们只需要给它传入一些基本的配置参数和数据就可以了。

ECharts 是一个使用JavaScript实现的开源可视化库，可以流畅地运行在PC和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的矢量图形库ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。

本文就给大家介绍一下，如何通过ECharts制作一个温度折线图，效果如下。

01.引入ECharts并创建对象

首先引入ECharts的JavaScript文件，然后为ECharts准备一个DOM容器，最后绘制空的折线图表。示例代码如下。