说在前面
有时候,我们可能会有某种特殊的需求,即在某种判断条件下,只给某几个柱状图进行高亮显示,下面给大家看看如何实现功能。
开门见山
实现的核心就是series
的itemStyle
可以每条数据单独编辑。
比如我们希望柱状图二者差值大于5时进行预警展示:
data.forEach((item) => {
let a = item.value1 - item.value2
if (a > 5 || a<-5) {
this.chartOption.series[0].data.push({
value: item.value1,
isSlant: item.isSlant,
itemStyle: {
shadowColor: 'rgba(255, 255, 0)',
shadowBlur: 10,
borderColor: 'rgba(255, 255, 0,0.9)',
borderWidth: 1
}
});
} else {
this.chartOption.series[0].data.push({
value: item.value1,
isSlant: item.isSlant,
});
}
})
实现效果如下:
说到最后
以上。