Question

I recently posted an issue regarding unpredictable hover on points in Highcharts, but the question didn’t get much traction. Probably because it’s difficult to explain.

I now posted a video here

http://www.youtube.com/watch?v=LovfLWpVVtc

showing this behavior.

It happens both on Chrome and Firefox (the video was done on FF on a high spec MacPro).

The video was done using this JsFiddle from the docs.

http://jsfiddle.net/HnwbQ/1/

As you can see, when approaching the first or last point from outside of the chart, no tootlip is shown. However if the cursor enters the chart and then approaches the first/last point, then a tooltip is rendered. This is erratic, and sometimes a tooltip is rendered when coming from the outside, sometimes it’s not.

Any ideas what’s the issue?

MORE INFO

This seems to occur mostly when using xAxis: {type: 'datetime'},

I am using Highcharts v2.1.9.

Answer 1

OK I think I found a hackish solution to this.

It seems to me this is a bug related to the fact that

xAxis: {type: 'datetime'}

pushes the first and last datapoint to the limits of the plot area (this doesn’t happen when using category).

So the way around this problem is to create some padding using

x-axis: {
minPadding:0.02,
maxPadding:0.02
}

Then hover behaves correctly, similar to when x-axis is category.

Note that minPadding and maxPadding have to be > 0.02. If you use 0.01 you’ll have a buggy hover.