实现前台样式的时候发现饼状图文字部分重合了
前言
实现前台样式的时候发现饼状图文字部分重合了如下面所示:
找了很多方法以下是个人总结的:
1.解决方法
代码如下,添加normal这段代码下面的textstyle控制字体的大小(示例):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
| series: [{ name: '类型', minAngle: 5, normal:{ formatter(v) { let text = Math.round(v.percent)+'%' + '' + v.name if(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)}` } },
//宪强加的防止标签覆盖 textStyle:{ //字体大小 fontSize: 12 } } }]
|