I have a Highcharts bubble chart where many of the points are going to have the same, or very similar values. Currently only the top point's data label is visible. I have functionality that allows the points to be highlighted (using the select()
method). When a point is selected I am also moving it to the top by using point.graphic.toFront()
, but I also want the selected point's data label to be moved to the top too. I can't figure out how to do that or if it's possible.
Is there a way to move an individual point's data label to the front/top so that it can be seen?
I know there is a setting to allow data labels to overlap, but that's not necessarily what I want to do. I would like to keep the current functionality where only the top data label is shown for overlapping points, but I would like to be able to programmatically control what point/data label are on top. I've tried to adjust the point's data label's z-index, but that didn't seem to do anything.
If you define labelrank as point property, then it will allow you control over label hide/show when labels are overlapping.
data: [{
x: 1, y: 1, labelrank: 1, name: 'A'
},{
x: 1, y: 1, labelrank: 2, name: 'B'
}]
}]
Example: http://jsfiddle.net/x5sfcekL/
来源:https://stackoverflow.com/questions/36579518/highcharts-bubble-chart-how-to-move-an-individual-points-data-label-datalabe