echarts 的resize 用来改变图表尺寸，当容器大小发生变化时使用 window.onresize = myChart.resize 可使图标随着屏幕大小改变。
1. 为echarts准备一个具有宽高的div容器（简单来说就是存放图表的一个占位）
2. 获取定义id并通过echarts.init()方法初始化echarts实例
3. 根据个人需求调整图表的配置项和数据
4. 通过setOption()方法生成图表
在官网给出了我们许多示例
我们都可以直接拿来用，但是里面的一些配置我们可以根据自己的需求来修改，所以我们需要了解ECharts的基础配置。
需要了解的主要配置：series xAxis yAxis grid tooltip title legend color
series– 系列列表。每个系列通过 type 决定自己的图表类型– 通俗的理解：图标数据，指定什么类型的图标，可以多个图表重叠。
xAxis：直角坐标系 grid 中的 x 轴
– boundaryGap: 坐标轴两边留白策略 true，这时候刻度只是作为分隔线，标签和数据点都会在两个刻度之间的带(band)中间。
yAxis：直角坐标系 grid 中的 y 轴
grid：直角坐标系内绘图网格。
title：标题组件
tooltip：提示框组件
legend：图例组件
color：调色盘颜色列表
stack：数据堆叠，同个类目轴上系列配置相同的stack值后 后一个系列的值会在前一个系列的值上相加。
还有一个可以作为补充：Gallery
立即执行函数
为了防止变量污染，减少命名冲突，我们可以采用立即执行函数的写法，因为立即执行函数里的变量都是局部变量。
我们需要var很多option ，我们采用立即执行函数包起来就不会参生命名冲突了。
让图表跟随屏幕自适应
// 当我们浏览器缩放的时候，图表也等比例缩放window.addEventListener("resize", function() {// 让我们的图表调用 resize这个方法
