Vue—Echarts饼图数据为0时如何不显示label与labelLine
【前言】在项目开发过程中,遇到这样的问题:当data中的value值为0时,在饼状图上是不占百分比的,例如下图:当value值为0时,如何让label与labelLine不显示呢?【内容】直接上代码series: [{label:{normal:{formatter:function(e){let data
·
【前言】
在项目开发过程中,遇到这样的问题:当data中的value值为0时,在饼状图上是不占百分比的,例如下图:
当value值为0时,如何让label与labelLine不显示呢?
【内容】
直接上代码
series: [
{
label:{
normal:{
formatter:function(e){
let data=e.data;
if(data.value==0){
data.labelLine.show=false;
data.label.show=false;
}else{
return data.name
}
},
}
},
type: 'pie',
radius: '65%',
center: ['50%', '50%'],
selectedMode: 'single',
data: [
{value: 484,name: '联盟广告',itemStyle:{'color':'#74a275'},labelLine: {show: true},label:{show:true}},
{value: 0, name: '视频广告',itemStyle:{'color':'#769a9f'},labelLine: {show: true},label:{show:true}},
{value: 580, name: '邮件营销',itemStyle:{'color':'#eddc7e'},labelLine: {show: true},label:{show:true}},
{value: 735, name: '直接访问',itemStyle:{'color':'#e87e58'},labelLine: {show: true},label:{show:true}},
{value: 1048, name: '搜索引擎',itemStyle:{'color':'#db6c69'},labelLine: {show: true},label:{show:true}}
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
说明:
1、在data中默认设置labelLine和label为显示
2、在label中判断为0的时候把show改为false
更多推荐
已为社区贡献2条内容
所有评论(0)