餅圖中的series有個avoidLabelOverlap屬性，

avoidLabelOverlap:是否啟用防止標(biāo)簽重疊策略，默認(rèn)開啟，在標(biāo)簽擁擠重疊的情況下會挪動各個標(biāo)簽的位置，防止標(biāo)簽間的重疊。

當(dāng)avoidLabelOverlap設(shè)置為false時會出現(xiàn)以下情況

改為true之后就不會重疊

代碼如下

var option = {

tooltip: {

trigger: "item",

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

},

legend: {

//orient: "vertical",

x: "0%",

//y: "25%",

//y: "5%",

itemWidth: 14,

itemHeight: 14,

align: "left",

data: xData,

textStyle: {

color: "#fff"

}

},

series: [

{

name: "危險源狀態(tài)",

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

}

]

};

補充知識：echarts柱狀圖輕松實現(xiàn)分別采用兩個不同單位的y軸

echarts柱狀圖輕松實現(xiàn)分別采用兩個不同單位的y軸：

秘籍：

代碼

// 基于準(zhǔn)備好的dom，初始化echarts實例

var colors = ['#0089FF','#B865DF',/*'#5ADF63','#FFDD00',*/'#224666', '#675bba'];

// 指定圖表的配置項和數(shù)據(jù)

option = {

/*grid:{

y:'25%'},*/

color: colors,

/* title: {

text: '各醫(yī)院指標(biāo)對比情況',

left: 16,

textStyle: {

fontSize: 18,

color:'#0089FF'

}

},*/

tooltip: {

trigger: 'axis',

axisPointer: {

type: 'cross',

crossStyle: {

color: '#999'

}

}

},

legend: {

data:['組數(shù)','CMI'],

x:'80%'

},

xAxis: [

{

type: 'category',

data: arr,

axisPointer: {

type: 'shadow'

},

axisLine: {

show: true,

/* lineStyle: {

color: '#05edfc'

}*/

},

axisLabel: {

show: true,

/* color: '#fff',*/

fontSize: 12,

interval: 0,

formatter:function(value)

{

return value;

}

//fontWeight: 'bold'

}

},

],

yAxis: [

{

type: 'value',

name: '組數(shù)整體指標(biāo)',

position: 'left',

splitLine:{show: true},

axisLine: {

show: false,

/* lineStyle: {

color: '#E7E7E7'

}*/

},

axisLabel: {

show:true,

showMinLabel:true,

showMaxLabel:true,

formatter: '{value}'

},

},

{

type: 'value',

name: 'CMI',

position: 'right',

splitLine:{show: true},

axisLine: {

show: false,

/* lineStyle: {

color: '#E7E7E7'

}*/

},

axisLabel: {

show:true,

showMinLabel:true,

showMaxLabel:true,

formatter: '{value}'

},

},

],

series: [

{

name:'組數(shù)',

type:'bar',

barWidth : 20,

data:arr2,

yAxisIndex: 0,

/* markPoint : {

data : [

{type : 'max', name: '最大值'},

{type : 'min', name: '最小值'}

]

}*/

},

{

name:'CMI',

type:'bar',

barWidth : 20,

data:arr3,

yAxisIndex: 1,

/* markPoint : {

data : [

{type : 'max', name: '最大值'},

{type : 'min', name: '最小值'}

]

}*/

}

]

};

以上這篇解決echarts中餅圖標(biāo)簽重疊的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持我們。

時間： 2020-05-14

總結(jié)

以上是生活随笔為你收集整理的echart饼图标签重叠_解决echarts中饼图标签重叠的问题的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。