微信小程序中Echart 的使用

1 下载微信微信部的echart 小程序 （https://github.com/ecomfe/echarts-for-weixin）
2 如果只是需要部分图表 可采用定制方式下载 减少小程序包的大小 (https://echarts.apache.org/zh/builder.html)
3 最重要的地方是 官方给的小程序echart 的 数据是写在data 外面的 。我们挺难去动态修改数据
可以采用如下方法 将 数据写在方法中 再数据setData 到data 中

import * as echarts from '../../ec-canvas/echarts';
var chart = null
function initChart(canvas, width, height, dpr) {
  chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);
  return chart;
}

Page({

  data: {
    ec: {
      onInit: initChart
    }
  },
  onLoad() {
    this.test()
  },
  test() {
    var option = {
      title: {
        text: '阅读书籍分布',
        left: 'center',
        textStyle: {
          color: '#999',
          fontWeight: 'normal',
          fontSize: 14
        }
      },
      backgroundColor: "#ffffff",
      series: [{
        label: {
          position: 'outside',
          alignTo: 'edge',
          formatter: '{name|{b}}\n{time|{c} 小时}',
          minMargin: 5,
          edgeDistance: 10,
          lineHeight: 15,
          rich: {
            time: {
              fontSize: 10,
              color: '#999'
            }
          },
        },
        type: 'pie',
        center: ['50%', '50%'],
        radius: ['20%', '40%'],
        data: [
          { name: '克莱因壶', value: 3.5 },
          { name: '投资最重要的事', value: 2.8 },
          { name: '简读中国史', value: 1.7 },
          { name: '你当像鸟飞往你的山', value: 1.4 },
          { name: '表象与本质', value: 0.5 },
          { name: '其它', value: 3.8 }
        ]
      }]
    };
    setTimeout(() => {
      chart.clear()
      chart.setOption(option);
    }, 1500)
  }
});