1. 解决前
2.解决后
3.代码
function makePie(id, title, name, data, show) {if (!show) {show = false;}var myChart = echarts.init(document.getElementById(id));var option = {title: {show:false,text: title,top: 2,left: '20',textStyle: {fontSize: 14,color:'#767676',fontWeight:600,fontFamily:'Microsoft Yahei'},},tooltip: {trigger: 'item',textStyle: {fontSize: 12,fontFamily:'Microsoft Yahei'},formatter: function (params) {return params.data.name + ":<br/>" + fmoneyf(params.data.value, 0) + "(" + params.percent + "%)";}},legend: {// type: 'scroll',orient:'vertical',top:80,y:'middle',height:'60%',right: getValueFromJson(data, 'name').length > 6 ? 0 : 5,textStyle: {fontSize: 12,color:'#848484'},icon:'circle',data: getValueFromJson(data, 'name')},series: [{name: name,x: 'left', y: 'center', type: 'pie',center:['50%', '60%'],//radius: getValueFromJson(data, 'name').length > 6 ? ['40%', '84px'] : ['46%','90px'],radius: '55%',avoidLabelOverlap: true,minAngle: 5,label: {align: 'left',normal: {show: show,lineHeight:30,textStyle: {fontFamily:'Microsoft Yahei'},formatter(v) {let text = Math.round(v.percent)+'%' + '' + v.nameif(text.length <= 8){return text;}else if(text.length > 8 && text.length <= 16){return text = `${text.slice(0,8)}\n${text.slice(8)}`}else if(text.length > 16 && text.length <= 24){return text = `${text.slice(0,8)}\n${text.slice(8,16)}\n${text.slice(16)}`}else if(text.length > 24 && text.length <= 30){return text = `${text.slice(0,8)}\n${text.slice(8,16)}\n${text.slice(16,24)}\n${text.slice(24)}`}else if(text.length > 30){return text = `${text.slice(0,8)}\n${text.slice(8,16)}\n${text.slice(16,24)}\n${text.slice(24,30)}\n${text.slice(30)}`}},rich: { color1: { color: '#000000',fontSize: 14,lineHeight:12,fontWeight:600}, color2: { color: '#848484' ,fontSize: 12,} }, }, emphasis: {show: !show,textStyle: {fontSize: 12,color:'#000000',fontFamily:'Microsoft Yahei'},formatter: function (params) {return params.data.name + ": " + fmoneyf(params.data.value, 0) + "(" + params.percent + "%)";}}},labelLine:{length:10,length2:100,lineStyle:{color:'#848484',}},data: data,color:getValueFromJson(data, 'color'),}]};myChart.setOption(option);}
4.主要代码段：
series: [{name: name,x: 'left', y: 'center', type: 'pie',center:['50%', '60%'],//radius: getValueFromJson(data, 'name').length > 6 ? ['40%', '84px'] : ['46%','90px'],radius: '55%',avoidLabelOverlap: true,minAngle: 5,label: {align: 'left',normal: {show: show,lineHeight:30,textStyle: {fontFamily:'Microsoft Yahei'},formatter(v) {//此方法为核心代码，解决问题let text = Math.round(v.percent)+'%' + '' + v.nameif(text.length <= 8){return text;}else if(text.length > 8 && text.length <= 16){return text = `${text.slice(0,8)}\n${text.slice(8)}`}else if(text.length > 16 && text.length <= 24){return text = `${text.slice(0,8)}\n${text.slice(8,16)}\n${text.slice(16)}`}else if(text.length > 24 && text.length <= 30){return text = `${text.slice(0,8)}\n${text.slice(8,16)}\n${text.slice(16,24)}\n${text.slice(24)}`}else if(text.length > 30){return text = `${text.slice(0,8)}\n${text.slice(8,16)}\n${text.slice(16,24)}\n${text.slice(24,30)}\n${text.slice(30)}`}},rich: { color1: { color: '#000000',fontSize: 14,lineHeight:12,fontWeight:600}, color2: { color: '#848484' ,fontSize: 12,} }, }, emphasis: {show: !show,textStyle: {fontSize: 12,color:'#000000',fontFamily:'Microsoft Yahei'},formatter: function (params) {return params.data.name + ": " + fmoneyf(params.data.value, 0) + "(" + params.percent + "%)";}}},
转载自：/liangayang/article/details/84792294
