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