echarts 折线图数值点的颜色设置

以下是设置echarts折线图数值点颜色的方法：

1.使用visualMap组件，设置visualMap-continuous参数为false，visualMap-dimension参数为1，visualMap-inRange参数为需要设置的颜色范围，visualMap-outOfRange参数为超出颜色范围的颜色。

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属性，分别设置折线上的数值点颜色和最大值、最小值的颜色。

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' // 设置最小值颜色
                    }
                }
            }]
        }
    }]
};