版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/LzzMandy/article/details/81251794
var actualData = [17, 8, 9, 10, 16, 15, 7]; //实际值
var warningData = [10, 10, 10, 10, 10, 10, 10]; //预警值
option = {
tooltip: {
trigger: 'axis',
},
legend: {
data: ['实际值', '预警标准'],
},
grid: [{
top: '10%',
left: '30%',
width: '50%',
height: '40%',
containLabel: false,
}],
xAxis: [{
type: 'category',
name: '日期',
data: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'],
}],
yAxis: [{
type: 'value',
name: '数量',
}],
series: [{
name: '实际值',
type: 'bar',
barWidth: 40,
itemStyle: {
normal: { //这里必须加normal,否者不显示夜色变化
color: function(params) {//超过预警值显示红色
if (actualData[params.dataIndex] > warningData[params.dataIndex]) {
return 'pink';
} else {
return 'green';
}
}
}
},
data: actualData
},
{
name: '预警标准',
type: 'line',
data: warningData,
itemStyle: {
normal: {
color: 'red'
}
}
}
]
};