Highlight active data label in Pie Chart (High Chart)

Question

I am working with Pie Chart (High Chart) and trying to get highlight effect on active I mean detached portion's label (text).

Is there a way to add any class which can say an active label so it can be style through css?

Here is a snap what I am trying to do... Any suggestion??

Answer 1

You can use addClass method to data labels from selected point and then style it the way you want:

    point: {
        events: {
            select: function() {
                var points = this.series.points;

                Highcharts.each(points, function(p) {
                    if (p.dataLabel.hasClass('data-label-selected')) {
                        p.dataLabel.removeClass('data-label-selected');
                    }
                });
                this.dataLabel.addClass('data-label-selected');
            }
        }
    }

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

API: https://api.highcharts.com/class-reference/Highcharts.SVGElement#addClass