javascriptcsshighchartshighcharts-gantt

Tooltip in Gantt Highcharts

I have problems with the Gantt Highcharts tooltip when scrolling.

This is the problem

As you can see in the image, the tooltip is behind the Gantt, I tried this code fragment but it doesn't work:

// JS

tooltip: {
    style: {
        zIndex: 9999
    }
},

This is my full code: https://jsfiddle.net/carmaro/ygvza0Lm/4/

Solution

  • The simplest solution is to enable the outside option for a tooltip. For example:

    tooltip: {
    outside: true,
    ...
}

    Live demo: https://jsfiddle.net/BlackLabel/r5jf0v96/

    API Reference: https://api.highcharts.com/highcharts/tooltip.outside