echart 饼图数据为0不显示或者太小显示其他的解决办法

饼图数据为0或者太小显示如下,不美观

解决办法:

为0的去掉,小于0.005的累加起来

方法

function getsData(_rowData){
    var rowData=JSON.parse(JSON.stringify(_rowData))
    var sum=rowData.reduce(function(o,v,i){
        o+=parseFloat(v.value);
        return o;
    },0)
    if(isNaN(sum)||sum==0){return []}
    rowData.sort(function(a,b){
        return a.value-b.value;
    }).reverse();
    var val=0;//其他的相加
    for(var i=rowData.length-1;i>0;i--){
        var _row=rowData[i],sub;
        sub=_row.value/sum;
        //如果为0或者小于.05的比例就将此元素移除
        if(sub<0.005){
            rowData.length=i;//去掉最后一个
            val+=parseFloat(_row.value);
        }
    }
    //在后面追加一个其他的项
    if(val>0){
        rowData[length].name="其他";
        rowData[length].value=val;
    }
    return rowData;
}

效果图

完整的option

var testData=[
                {value:3331, name:'直接访问'},
                {value:3110, name:'邮件营销'},
                {value:234, name:'联盟广告'},
                {value:0, name:'联盟广告'},
                {value:10, name:'联盟广告1'},
                {value:10, name:'联盟广告22'},
                {value:10, name:'联盟广告122'},
                {value:10, name:'联盟广告333'},
                {value:20, name:'联盟广告3'},
                {value:10, name:'联盟广告4'},
                {value:11135, name:'视频广告'},
                {value:11548, name:'搜索引擎'}
            ],
option = {
    title : {
        text: '某站点用户访问来源',
        subtext: '纯属虚构',
        x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
        orient: 'vertical',
        left: 'left',
        data: ['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
    },
    series : [
        {
            name: '访问来源',
            type: 'pie',
            radius : '55%',
            center: ['50%', '60%'],
            data:getsData(testData),
           //data:testData,
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
        }
    ]
};
function getsData(_rowData){
    var rowData=JSON.parse(JSON.stringify(_rowData))
    var sum=rowData.reduce(function(o,v,i){
        o+=parseFloat(v.value);
        return o;
    },0)
    if(isNaN(sum)||sum==0){return []}
    rowData.sort(function(a,b){
        return a.value-b.value;
    }).reverse();
    var val=0;//其他的相加
    for(var i=rowData.length-1;i>0;i--){
        var _row=rowData[i],sub;
        sub=_row.value/sum;
        //如果为0或者小于.05的比例就将此元素移除
        if(sub<0.005){
            rowData.length=i;//去掉最后一个
            val+=parseFloat(_row.value);
        }
    }
    //在后面追加一个其他的项
    if(val>0){
        rowData[length].name="其他";
        rowData[length].value=val;
    }
    return rowData;
}
View Code
原文地址:https://www.cnblogs.com/pengfei25/p/10553058.html