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

  var option = {
    backgroundColor: "#ffffff",
    tooltip: {
      show: true,
      trigger: 'item'
    },
    color: ['#46B3FD', '#FFC459', '#14C9C9'],
    series: [{
      type: 'pie',
      avoidLabelOverlap: false,
      center: ['50%', '50%'],
      radius: ['40%', '60%'],
      labelLine: {
        length: 20,
        length2: 120,
        // maxSurfaceAngle: 120
      },
      label: {
        alignTo: 'edge',
        formatter: '{name|{b}}   {name|{d}}%\n{time|{c}}',
        // formatter: function (params:any) {
        //   console.log(params,'----formatter---')
        // },
        minMargin: 5,
        edgeDistance: 10,
        lineHeight: 16,
        rich: {
          name: {
            fontSize: 12,
            fontFamily: "PingFangSC-Regular",
            color: "#666671"
          },
          time: {
            fontSize: 12,
            color: '#323241',
          }
        }
      },
      data: [
        { value: 400, name: '离线率' },
        { value: 400, name: '未配置' },
        { value: 600, name: '在线率' },
      ]
    }]
  };

  chart.setOption(option);
  return chart;
}

Component({
  /**
   * 组件的属性列表
   */
  properties: {

  },

  /**
   * 组件的初始数据
   */

  data: {
    ec: {
      onInit: initChart
    }
  }

  /**
   * 组件的方法列表
   */

})