Highcharts - HTML tooltip & datalabels render issue

By : Tony
Source: Stackoverflow.com

here is my problem, when you set useHTML: true for datalabels, it seems that the label text will override the tooltip background.

You can see the behaviour in this simple fiddle: bar chart

Try to display a tooltip on mouse over a bar, and you will see the text of the datalabel in the tooltip background.

Is it possible to set a z-index on the data labels?

I've tried to add this in the tooltip definition but without success:

style : {
    color: 'black',
    'z-index': 0

I've also tried to set up span classes for data labels and tooltips, then add a z-index into css properties for these classes, but it's still not working.

Edit: As I'm still searching for a solution to my problem, can someone could point me the way to add a class to the bars (or the datalabels) of the charts? My aim is to call a specific onclick event on this class.

By : Tony


Check http://api.highcharts.com/highcharts#tooltip.backgroundColor for tooltip background color.

Same kind problem was solved with this property at highslide forum

By : arunes

This video can help you solving your question :)
By: admin