通过ECharts的itemStyle设定一个数组设定颜色的循环,详见begin到end的代码
option= { backgroundColor: '#003', title: { text: '耗时', textStyle: { color: '#eee' } }, tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: { type: 'value', boundaryGap: [0, 0.01], axisLine: { lineStyle: { color: '#eee' } } }, yAxis: { type: 'category', data: serviceKey, axisLine: { lineStyle: { color: '#eee' } } }, series: [ { name: '耗时', type: 'bar', data: avgTime, //begin itemStyle: { normal:{ color: function (params){ var colorList = ['rgb(205,85,85)','rgb(210,105,30)','rgb(0,139,0)','rgb(178,58,238)','rgb(54,100,139)']; return colorList[params.dataIndex]; } }, //鼠标悬停时: emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } }, //end } ] } myChart.setOption(option);