默認(rèn)樣式：
image.png
需求樣式：
image.png
可以看到，二圖中文字和線的相對(duì)位置是不一樣的。需求的樣式，可通過(guò)設(shè)置
label > padding和labelLine > length / length2來(lái)實(shí)現(xiàn)。關(guān)鍵點(diǎn)在于設(shè)置一個(gè)負(fù)的padding。以下為參考代碼：
app.title = '環(huán)形圖';
option = {
tooltip: {
trigger: 'item',
formatter: "{a} <br/>: {c} (u0z1t8os%)"
},
legend: {
orient: 'vertical',
show: false,
x: 'left',
data: ['視頻廣告', '百度', '谷歌', '必應(yīng)', '其他']
},
series: [
{
name: '訪問(wèn)來(lái)源',
type: 'pie',
radius: ['30%', '55%'],
labelLine: {
normal: {
length: 20,
length2: 70,
lineStyle: {
color: '#333'
}
}
},
label: {
normal: {
formatter: '{b|}{a|u0z1t8os%}\n\n',
borderWidth: 20,
borderRadius: 4,
padding: [0, -70],
rich: {
a: {
color: '#333',
fontSize: 12,
lineHeight: 20
},
b: {
fontSize: 12,
lineHeight: 20,
color: '#333'
}
}
}
},
data: [{
value: 135,
name: '視頻廣告'
}, {
value: 1048,
name: '百度'
}, {
value: 251,
name: '谷歌'
}, {
value: 147,
name: '必應(yīng)'
}, {
value: 102,
name: '其他'
}]
}
]
};
