配置项如下
let index = 0;
var colorList = ['#02F2F3', '#68B5FB', '#D45A49', '#F3E58D']
function fun() {
var timer = setInterval(function() {
myChart.dispatchAction({
type: 'hideTip',
seriesIndex: 0,
dataIndex: index
});
// 显示提示框
myChart.dispatchAction({
type: 'showTip',
seriesIndex: 0,
dataIndex: index
});
// 取消高亮指定的数据图形
myChart.dispatchAction({
type: 'downplay',
seriesIndex: 0,
dataIndex: index == 0? 5 : index -1
});
myChart.dispatchAction({
type: 'highlight',
seriesIndex: 0,
dataIndex: index
});
index++;
if (index > 5) {
index = 0;
}
},3000)
}
fun()
setTimeout(function() {fun()}, 5000);
option = {
backgroundColor: '#101736',
"title": {
"text": "人员配比分析",
x: "4%",
width: 173,
height: 163,
fontSize: 22,
textStyle: {
color: '#05F0EE',
fontSize: '22'
},
subtextStyle: {
color: '#90979c',
fontSize: '16',
},
},
tooltip: {
trigger: 'item'
},
series: [{
type: 'pie',
center: ['50%', '50%'],
radius: ['24%', '45%'],
clockwise: true,
avoidLabelOverlap: true,
hoverOffset: 15,
itemStyle: {
normal: {
color: function(params) {
return colorList[params.dataIndex]
}
}
},
label: {
show: true,
position: 'outside',
formatter: '{a|{b}:{c} 人}',
rich: {
hr: {
backgroundColor: 't',
borderRadius: 3,
width: 3,
height: 3,
padding: [3, 3, 0, -12]
},
a: {
padding: [-30, 15, -20, 15]
}
}
},
labelLine: {
normal: {
length: 20,
length2: 100,
lineStyle: {
width: 1
}
}
},
data: [{
'name': '行政编制',
'value': 646
}, {
'name': '合同编制',
'value': 1380
}, {
'name': '文职',
'value': 133
}, {
'name': '编制干部',
'value': 361
}
],
}]
};