Highcharts Bubble Chart - How to transfer a single point data label (dataLabel) to the front / top

I have a Highcharts bubble chart in which many points will have the same or very similar values. Currently, only the high point data label is visible. I have functionality that allows me to highlight points (using the select() method). When a point is selected, I also move it up using point.graphic.toFront() , but I also want the label of the selected point label to also be moved to the top. I cannot figure out how to do this or if it is possible.

Is there a way to move a single point data label to the front / top so that it can be seen?

I know that there is a parameter that allows overlapping data labels, but this is not necessarily what I want to do. I would like to keep the current functionality where only the top data label for overlapping points is displayed, but I would like to be able to programmatically control which point / data label is on top. I tried adjusting the z-index label of the point data label, but this seemed to do nothing.

+3
source share
1 answer

If you define labelrank as a point property, this will allow you to control the hiding / displaying of labels when labels overlap.

  data: [{ x: 1, y: 1, labelrank: 1, name: 'A' },{ x: 1, y: 1, labelrank: 2, name: 'B' }] }] 

Example: http://jsfiddle.net/x5sfcekL/

+2
source

All Articles