CODEWITHSUNDEEP
javascriptjqueryhighcharts
looshi
looshi

Reputation: 1236

highcharts - set line color on mouseover and mouseout?

I'm attempting to set the line color in highcharts when a user mouses over the line, then change the line color to something else when the user mouses out.

This js fiddle changes color of the line on mouse over, but afterwards throws errors and the mouse out never seems to fire : http://jsfiddle.net/looshi/za7n3h29/10/

The js fiddle above was forked from this SO answer which sets a line attribute programmatically after the chart has been initialized : Highcharts -- how to change line width programmatically and prevent resetting line width?

I'd like to verify whether or not this is possible using the mouse events options for a series : 

        point: {
          events: {
            mouseOver: onMouseOver,
            mouseOut: onMouseOut
          }
        }

I'm aware there are some 'hover' options for the chart's initial configuration, however would like to set this color after the chart has been initialized.

Upvotes: 1

Views: 456

Answers (1)

Nishith Kant Chaturvedi
Nishith Kant Chaturvedi

Reputation: 4769

you need to use stickyTracking: false. You are getting error because after mouseOut its trying to get a point's data in tooltip. you should call mouseOver and mouseOut in series instead of series.point

See Updated fiddle here

stickyTracking: false,

          events: {
            mouseOver: onMouseOver,
            mouseOut: onMouseOut
          }

Upvotes: 3

Related Questions