Echarts动画

1. 定时器
   用定时器来动态改变数据，需求是：每页展示五条销量数据，每隔几秒切换当前页数据，整页数据的切换

• 首先，定义当前页和总页数的数据
  

• 写更新图表方法
  在更新图表方法中，根据currentPage定义数据展示起始和结束的下标，用数组的splice方法对数据进行截取，截取出当前页要展示的数据，setOption更新图表
  

• 写定时器方法
  在定时器方法中，每隔一定的时间，currentPage自加1，然后再调用更新图表的updateChart方法，更新图表
  

• 获取到数据后，先对数据进行排序，然后求出总页数totalPage，调用更新图表的方法，启动定时器
  
  

2. 利用datazoom更新数据
   需求：柱状图平移动画，每次平移几个数据，用定时器控制datazoom的startValue和endValue，一个数据一个数据的平移

• 先定义缩放区域起始值和终点值
  
• 更新图表方法
  设置datazoom的startValue和endValue
  
• 定时器定时改变startValue和endValue
  
• 获取到数据后，先对数据进行排序，然后求出总页数totalPage，调用更新图表的方法，启动定时器
  
  

3. 切换图表选项，更新数据
   需求：销量按照地区，产品种类，不同商家来展示，选择不同的排行要求，销量按照对应的要求排行

• 先定义按照什么排序
  
• 更新图表数据
  根据选择不同的choiceType更新图表数据
  
• 切换选择的数据choiceType
  选择不同的choiceType，调用更新图表数据的方法
  

4. 一级目录下的二级目录的百分比
需求：每个一级目录下都有很多的二级目录，根据二级目录不同的百分比绘制饼图，然后点击左右箭头可以切换不同的一级目录

实现的原理和第一种的用定时器来切换当前显示页的数据一样，不过此处用的不是定时器，而是手动点击左右箭头来控制动画

5. 环形图切换，定时器，当前页
和第一种的用定时器来切换当前显示页的数据一样

所以，动画一般用定时器或者datazoom来实现