Alex Rivera | Logout

Highcharts - labels inside and outside a pie chart

Asked 2012-03-05T20:17:11.803
11

I know it's possible to put pie chart labels either inside or outside the pie by changing plotOptions.pie.dataLabels.distance. I am trying to figure out whether it's possible to change that on a point by point basis:

if slice is smaller than 15%, place labels inside the slice

else place the label outside the slice

Is this possible in Highcharts? Below is one of my attempts, which doesn't work; the plain jsfiddle is here: http://jsfiddle.net/supertrue/q6bQP/

plotOptions: {
    pie: {
        dataLabels: {
            distance: -30,
            color: 'white',
            formatter: function() {
                if (this.y < 15 ) {
                    this.point.dataLabels.color = 'red';
                    this.point.dataLabels.distance = 20;
                    return this.point.name;
                } else {
                    return this.point.name;
                }

        }
  },
Edit
Report

1 Answer

2

This post can helps you to acomplish your work :

Is it possible to position Highcharts dataLabels depending on the value?

$.each(chart.series[0].data, function(i, point) {
    // using the value or calculating the percent        
    if(point.percentage < 30) {
        point.dataLabel.attr({y:20});
    }
});
answered 2012-06-21T17:05:36.027

Your Answer