vue项目中Echarts饼图数值全为0时，比例出现undefined解决方案

项目场景：

项目场景：项目中数据看盘需要显示饼图并且显示比例（百分比）

---

问题描述

项目中一般会封装echarts，但是当两个参数为0时，比例就会出现undefined：

 var option1 = {
        title: {
            text: '性别占比',
            x: 'center'
        },
        tooltip: {},
        legend: {
            data: ['人数']
        },
        series: [{
            name: '',
            type: 'pie', // 设置图表类型为饼图
            radius: '55%', // 饼图的半径，外半径为可视区尺寸（容器高宽中较小一项）的 55% 长度。
            color: ['#37A2DA', '#32C5E9'],
            label: {
                normal: {
                    show: true,
                    formatter: '{b}: {c}({d}%)'
                }
            },
            // roseType: 'angle',
            data: [ // 数据数组，name 为数据项名称，value 为数据项值
                {
                    value: 0,  
                    name: '男生'
                }, {
                    value: 0,
                    name: '女生'
                }
            ]
        }]

    };

---

原因分析：

这里因为我们用到了echarts中的 formatter: ‘{b}: {c}({d}%)’ ，然而data中的两个value都为0，params.percent的值是无法计算出来的，因此需要我们自行计算

---

解决方案：

其实很好解决，代码如下

formatter: function (params) {
	if (params.percent === undefined) {
	    return params.name + 50 + '%'
	  } else if (params.percent === 0) {
	    return params.name + params.percent + '%'
	  } else {
	    return params.name + params.percent + '%'
	  }
	}