Search code examples
javascripthighchartsdonut-chart

Add custom data on tooltip of Highcharts donut graph

I'm trying to figure out how to modify the tooltip of a Highcharts donut graph. Following the example in the site, I tried to add another property ('newData') to the drilldown of each data. You can see the example here: http://jsfiddle.net/vxm0gnz5/1/

data = [{
        y: 55.11,
        color: colors[0],
        drilldown: {
            name: 'MSIE versions',
            categories: ['MSIE 6.0', 'MSIE 7.0', 'MSIE 8.0', 'MSIE 9.0'],
            data: [10.85, 7.35, 33.06, 2.81],
            newData: [1, 2, 3, 4],
            color: colors[0]
        }
    }, {
    ... other data sets here ...
    }
]

However, I don't seem to retrieve the data in newData portion. Is there a way that I could extract it so I could display its value on the tooltip? Thank you!

Solution

  • In case when you add new parameter for data, you need to also update this information in loop which parse your data. 

    drilldownNewData.push(data[i].newData);

    Example: http://jsfiddle.net/sbochan/vxm0gnz5/2/

    Array is available in the this.options.newData reference (like in the dataLabels).