Rotating dataLabels in a Highcharts pie chart

Question

I\'m trying to rotate and position the dataLabels in each segment of a Highcharts pie chart and just feel like Im getting myself deeper and deeper without getting closer to

Answer 1

Highcharts is not providing options for auto rotating data labels in pie chart. You can write your custom function for dataLabels rotation.

Here is simple example how you can do it:

var allY, angle1, angle2, angle3,
    rotate = function () {
        $.each(options.series, function (i, p) {
            angle1 = 0;
            angle2 = 0;
            angle3 = 0;
            allY = 0;
            $.each(p.data, function (i, p) {
                allY += p.y;
            });

            $.each(p.data, function (i, p) {
                angle2 = angle1 + p.y * 360 / (allY);
                angle3 = angle2 - p.y * 360 / (2 * allY);
                p.dataLabels.rotation = -90 + angle3;
                angle1 = angle2;
            });
        });
    };

First I am calculating sum of all Y values. Then I am calculating the angle of middle of all pie slices. Then I am rotating data labels by the same angle.

example: http://jsfiddle.net/izothep/j7as86gh/6/

similar topic: Radial Pie Chart Datalabels in Highcharts