思路:
1. 每一项数据增加默认项 show 为 true
label: {show: true},
labelLine: {show: true}
2. 在遍历 data 的属于为 0 的就把 show 赋值为 false
/* 预警事件 */
initCensus() {
this.census = {
tooltip: {
trigger: "item",
formatter: `{a} <br/>{b} <br/> {c} ({d}%)`,
},
series: [
{
name: "",
type: "pie",
radius: "60%",
center: ["50%", "50%"],
data: [
{value: this.ChartData["预警"]["储存工夫"],
name: "储存工夫",
itemStyle: {color: "#2498ff"},
label: {show: true},// 增加项
labelLine: {show: true},// 增加项
},
{value: this.ChartData["预警"]["可燃气体"],
name: "可燃气体",
itemStyle: {color: "#18e3ff"},
label: {show: true},
labelLine: {show: true},
},
{value: this.ChartData["预警"]["TVOC"],
name: "TVOC",
itemStyle: {color: "#1fb4ff"},
label: {show: true},
labelLine: {show: true},
},
].sort(function (a, b) {return a.value - b.value;}),
roseType: "radius",
label: {
position: "outer",
alignTo: "none",
color: "#f1f1f1",
},
labelLine: {
lineStyle: {color: "#f1f1f1",},
smooth: 0.1,
length: 10,
length2: 12,
},
animationType: "scale",
animationEasing: "elasticOut",
animationDelay: function (idx) {return Math.random() * 200;
},
},
],
};
this.setEchartsHide(this.census.series[0].data);
},
/* 暗藏数据为 0 的数据 */
setEchartsHide(data) {const Arr = data.map((item) => item.value).join("");
// 如果每项都为 0 则不暗藏
if (+Arr) {data.forEach((item) => {if (!item.value) {
item.label.show = false;
item.labelLine.show = false;
}
});
}
},