echarts折线图分段显示颜色 — vue技术交流群(864583465)
1、直接上代码
option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
visualMap: {
show: false,
dimension: 1,
type: 'piecewise',
pieces: [
{
min: 0,
max: 70,
color: 'green'
},
{
min: 58,
max: 200,
color: 'red'
}
]
},
series: [
{
data: [120, 110, 96, 85, 76, 69, 52],
type: 'line',
markLine: {
silent: true,
lineStyle: {
color: '#333'
},
symbol: 'none',
data: [
{
yAxis: 70,
label: {
position: 'start',
padding: [10, 50]
},
symbol: 'none',
lineStyle: {
color: 'red',
}
}
]
}
}
]
};
2、代码效果图