自定义labelLine.png

上代码 ↓

methods: {
initPie () {
               data.map((n) => {
                this.pieData.push({
                    value: n.value,
                    name: n.name,
                    label: {
                        show: false
                    },
                    labelLine: {
                        show: false
                    }
                })
            })

            let sortArr = this.pieData
                .sort(function (a, b) {
                    return b.value - a.value
                })
                .slice(0, this.labelNum)

            this.pieData.map((m) => {
                for (let i = 0; i < sortArr.length; i++) {
                    if (sortArr[i].name === m.name) {
                        m.label = {
                            show: true
                        }

                        m.labelLine = {
                            show: true
                        }

                        return m
                    }
                }
            })

            this.options = {
                graphic: {
                    elements: [
                        {
                            type: 'image',
                            style: {
                                image,
                                width: this.imageSize,
                                height: this.imageSize
                            },
                            left: 'center',
                            top: 'center'
                        }
                    ]
                },
                tooltip: {
                    trigger: 'item'
                },
                legend: {
                    bottom: this.legend.bottom,
                    left: this.legend.left,
                    top: this.legend.top,
                    right: this.legend.right,
                    itemWidth: 16,
                    itemHeight: 8,
                    borderRadius: 5
                },
                series: [
                    {
                        type: 'pie',
                        radius: ['40%', '70%'],
                        center: this.center,
                        label: {
                            normal: {
                                show: false,
                                formatter: '{b} {c}'
                            }
                        },
                        data: this.pieData
                    }
                ]
            }
            this.drawChart()
  }
}

主要是做数据的转换