score:1

Accepted answer

Disable series states and use attr method to change stroke and fill colors:

plotOptions: {
    series: {
        states: {
            hover: {
                enabled: false
            },
            inactive: {
                enabled: false
            }
        },
        events: {
            mouseOver: function() {
                this.graph.attr({
                    stroke: "rgb(255,0,0)"
                });
                this.points.forEach(p => p.graphic.attr({
                    fill: "rgb(255,0,0)"
                }));
            },
            mouseOut: function() {
                this.graph.attr({
                    stroke: this.color
                });
                this.points.forEach(p => p.graphic.attr({
                    fill: this.color
                }));
            }
        }
    },
},

Live demo: https://jsfiddle.net/BlackLabel/dnr93Law/

API Reference:

https://api.highcharts.com/highcharts/series.line.states

https://api.highcharts.com/class-reference/Highcharts.SVGElement#attr


Related Query

More Query from same tag