echarts pie饼图 series 修改label标签颜色
效果图:
代码:
var datas = [
[
{ name: '圣彼得堡来客', value: 5.6 },
{ name: '陀思妥耶夫斯基全集', value: 1 },
{ name: '史记精注全译(全6册)', value: 0.8 },
]
];
option = {
title: {
text: '阅读书籍分布',
left: 'center',
textStyle: {
color: '#999',
fontWeight: 'normal',
fontSize: 14
}
},
series: datas.map(function (data, idx) {
var top = idx * 33.3;
return {
type: 'pie',
radius: [20, 60],
top: top + '%',
height: '33.33%',
left: 'center',
width: 400,
itemStyle: {
borderColor: '#fff',
borderWidth: 1
},
color: ['#E99720', '#17B179', '#3388C9'],
label: {
alignTo: 'edge',
minMargin: 20,
edgeDistance: 15,
lineHeight: 28,
formatter: function(data) {
if(data.dataIndex == 0) {
return '{name1|'+data.data.name+'}\n{time|'+data.data.value+'}';
} else if(data.dataIndex == 1) {
return '{name2|'+data.data.name+'}\n{time|'+data.data.value+'}';
} else {
return '{name3|'+data.data.name+'}\n{time|'+data.data.value+'}';
}
},
rich: {
name1: {
color: '#E99720',
fontSize: 13
},
name2: {
color: '#17B179',
fontSize: 13
},
name3: {
color: '#3388C9',
fontSize: 13
},
time: {
color: '#333',
fontSize: 13
}
},
},
labelLine: {
length: 15,
length2: 0,
maxSurfaceAngle: 80
},
labelLayout: function (params) {
var isLeft = params.labelRect.x < myChart.getWidth() / 2;
var points = params.labelLinePoints;
// Update the end point.
points[2][0] = isLeft
? params.labelRect.x
: params.labelRect.x + params.labelRect.width;
return {
labelLinePoints: points
};
},
data: data
}
})
};