Search code examples
highchartssunburst-diagram

Set a different tooltip formatter for each sunburst levels - Highcharts


I created a sunburst chart with highcharts. I set the config object given to Highcharts.chart('type', config) in python. I want to have one different tooltip for each level of the sunburst chart.

I can do a big js function that search the level of the point in my data then give the level to the tooltip formatter to display the specific data, but that is not suitable I think.

Is there any highcharts function to get the point's level or to define the tooltip in series.levels[]?


Solution

  • You could get this based upon the slice's level property. You can do something like:

    tooltip: {
        formatter: function () {
            console.log(this); // see what each slice's properties are
            if (this.point.node.level == 4) {
                return 'Population of <b>' + this.point.options.name +
                       '</b> is <b>' + this.point.options.value + '</b>';
            } else {
                return 'Level <b>' + this.point.node.level + '</b> has no tooltip';
            }
        }
    }
    

    Example jsFiddle