以下是设置echarts折线图数值点颜色的方法：
1.使用visualMap组件，设置visualMap-continuous参数为false，visualMap-dimension参数为1，visualMap-inRange参数为需要设置的颜色范围，visualMap-outOfRange参数为超出颜色范围的颜色。
```javascript
option = {
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
itemStyle: {
normal: {
color: '#000' // 设置折线颜色
}
},
lineStyle: {
normal: {
color: '#000' // 设置折线颜色
}
},
markLine: {
silent: true,
data: [{
yAxis: 900,
lineStyle: {
normal: {
color: 'gold' // 设置超过900的颜色
}
}
}]
},
markPoint: {
data: [{
type: 'max',
name: '最大值',
itemStyle: {
normal: {
color: 'red' // 设置最大值颜色
}
}
}, {
type: 'min',
name: '最小值',
itemStyle: {
normal: {
color: 'green' // 设置最小值颜色
}
}
}]
}
}],
visualMap: {
show: false,
dimension: 1,
continuous: false,
inRange: {
color: ['blue', 'red'] // 设置颜色范围
},
outOfRange: {
color: '#ccc' // 设置超出颜色范围的颜色
}
}
};
```
2.使用series中的itemStyle和markPoint属性，分别设置折线上的数值点颜色和最大值、最小值的颜色。
```javascript
option = {
xAxis: {
type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
itemStyle: {
normal: {
color: '#000', // 设置折线颜色
borderColor: '#000' // 设置数值点边框颜色
}
},
markPoint: {
data: [{
type: 'max',
name: '最大值',
itemStyle: {
normal: {
color: 'red' // 设置最大值颜色
}
}
}, {
type: 'min',
name: '最小值',
itemStyle: {
normal: {
color: 'green' // 设置最小值颜色
}
}
}]
}
}]
};
```
修改后
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
