解决echarts中饼图标签重叠的问题

2021-08-25  本文已影响0人  安北分享

饼图中的series有个avoidLabelOverlap属性,

avoidLabelOverlap:是否启用防止标签重叠策略,默认开启,在标签拥挤重叠的情况下会挪动各个标签的位置,防止标签间的重叠。

当avoidLabelOverlap设置为false时会出现以下情况

改为true之后就不会重叠

var option = {
tooltip: {
trigger: "item",

formatter: "{a}
{b} : {c} ({d}%)"

},

legend: {
//orient: "vertical",

x: "0%",

//y: "25%",

//y: "5%",

itemWidth: 14,

itemHeight: 14,

align: "left",

data: xData,

textStyle: {
color: "#fff"

}

},

series: [

{
name: "危险源状态",

type: "pie",

radius: ["25%", "45%"],

center: ["50%", "60%"],

avoidLabelOverlap: true,//对,就是这里avoidLabelOverlap

label: {
normal: {
show: true,

position: "center"

},

emphasis: {
show: true,

textStyle: {
fontSize: "12",

fontWeight: "bold"

}

}

},

labelLine: {
normal: {
show: true
}
},
data: pieData
}
]

};
上一篇 下一篇

猜你喜欢

热点阅读