HighCharts selects the wrong data point

0
votes

I have a Highcharts with two series (one as type "line" and other as "scatter"). The "line" serie has 1000+ value points and the "scatter" serie has one value point (the y value of this point is = 2)

I want to select the "scatter" point on the yAxis, but this point will not be selected. Instead of this point, the other points (line) are selected. The property "allowPointSelect" is set to true

Other important options that are enabled:

  • crosshair = true (xAxis only)
  • stickyTracking = true;

Before selection

After selection

What I have tried already:

  • the radiusPlus and radius properties changed to bigger value <100 (plotOptions.series.marker.states.hover and plotOptions.series.marker.states.select)*

Note: It's very difficult to reproduce this in jsfiddle with 1000+ values :(. That's why I added some screens).

Does anyone have a solution for this?

1
highchartslinescatter
I answered to your post on forum. Here is the link: forum.highcharts.com/highcharts-usage/… . Please move there the thread of this topic. - daniel_s
@daniel_s i think you added the wrong link? - E75
Sorry, my bad. Here is the correct link: forum.highcharts.com/highcharts-usage/… - daniel_s

1 Answers

0
votes

If you are never wanting the user to select the scatter point (or any scatter points) you can set the zIndex of the series such that the line series is rendered "above" the scatter series. From the docs:

zIndex: Number Define the visual z index of the series.

Defaults to undefined.

With no z index, the series defined last are on top With a z index, the series with the highest z index is on top