// json文件

"usingComponents": {

   "ec-canvas": "../../ec-canvas/ec-canvas"

 }

// wxml文件

<view class="containers">

  <ec-canvas id="mychart-dom-bar" canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>

</view>

// 外层用view包裹方便设置echarts元素的宽高

// js

import * as echarts from '../../ec-canvas/echarts';

const app = getApp()

function initChart(canvas, width, height, dpr) {

  const chart = echarts.init(canvas, null, {

    width: width,

    height: height,

    devicePixelRatio: dpr // 像素

  });

  canvas.setChart(chart);

  let option = {

    title: {},

    tooltip: {

      trigger: 'item',

      formatter: '{b} : {c}'

    },

    legend: {

      left: 'center',

      bottom: 20,

      textStyle: {

        fontSize: 8,

        color: '#ffffff'

      },

      data: ['已联系客户', '未联系客户']

    },

    color: ['#FD7031','#00d6a5'],

    series: [{

      name: '客户',

      type: 'pie',

      radius: '60%',

      center: ["45%", "38%"],

      label: {

        position: 'inner',

        show: true,

        formatter: '{c}'

      },

      data: [{

          value: app.globalData.pieData? app.globalData.pieData[0] : 0,

          name: '已联系客户',

          formatter: '{c}',

          tooltip: {

            trigger: 'item',

            formatter: '{b} : {c}'

          }

        },

        {

          value: app.globalData.pieData? app.globalData.pieData[1] : 0,

          name: '未联系客户',

          formatter: '{c}',

          tooltip: {

            trigger: 'item',

            formatter: '{b} : {c}'

          }

        }

      ],

      emphasis: {

        itemStyle: {

          shadowBlur: 10,

          shadowOffsetX: 0,

          shadowColor: 'rgba(0, 0, 0, 0.5)'

        }

      },

    }]

  };

  chart.setOption(option);

  return chart;

}

Page({

  data: {

    ec: {

      onInit: initChart

    }

  }

})