为防止混淆定义,在此针对“空数据”做一下必要的划分哈!
空数据,即data是空数组
在这里不显示空数据,也就意味着不显示饼图咯,这个时候直接设置stillShowZeroSum
为false
即可。1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17option = {
title : {
text: '睡眠质量统计',
subtext: '纯属虚构',
x:'center',
},
series : [
{
name: '睡眠质量',
type: 'pie',
stillShowZeroSum:false, // 就是这里啦!
radius : '70%',
center: ['50%', '40%'],
data:pie_data,
},
],
};
在此附上文档传送门: http://echarts.baidu.com/option.html#series-pie.stillShowZeroSum
某一类数据为空
目前只能做到 数据为空时,处于饼图内部的标签不显示,其他的位置的标签暂时没想到解决办法。若是小伙伴你有其他法子,哈哈,求分享~
也就是指这一类的数据在饼图上不显示,网上搜到很多都是针对label的show做处理,使用匿名函数,判断值为空就返回false,反之true来达到显示隐藏的效果。
然而我尝试了N次都失败了,后面想到可以在label的格式化formatter下手,值为空那就返回空字符串不就好了,我是这么做的:1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25option = {
title : {
text: '睡眠质量统计',
subtext: '纯属虚构',
x:'center',
},
series : [
{
name: '睡眠质量',
type: 'pie',
stillShowZeroSum:false, // 无数据,不显示饼图
radius : '70%',
center: ['50%', '40%'],
data:pie_data,
label:{
position:'inside', // 标签显示在饼图扇区内部
formatter:function(v){
if(!v.value){
return ''; // 无数据,返回空字符串
}
},
},
},
],
};