2

Is it possible to position the Kendo Pie Chart labels depending on whether there is enough room for them to fit inside the Pie Chart, just like the best fit option in Excel? So if they can fit they go inside and if they can't an arrow will point to them from the outside. Possibly similar to this: Kendo barchart category labels left and right based on value

I don't mind doing it manually if I have to because I don't think Kendo has the feature built in.

Pie chart example

Community
  • 1
  • 1
Gabriel Sadaka
  • 1,748
  • 1
  • 15
  • 19

1 Answers1

4

I just worked it out, it turns out kendo passes the current data item as a parameter to the position property if you set it to a function, so all I had to do was check it's percentage and if its less than 30% (or whatever you want) then it will be in the inside otherwise it will be on the outside. The same can be done with color.

$("#chart").kendoChart({
  series: [ {
    labels: {
      visible: true,
      align: "circle",
      position: function(e) { 
        if(e.percentage < 0.1)
            return "outsideEnd";
        else
          return "insideEnd";
      },
      color: function(e) {
        if(e.percentage < 0.1)
            return "#000";
        else
          return "#fff";
      }
    },
    type: "pie",
    data: [2,1,3,4,2, 5]
  }]
});

http://dojo.telerik.com/ewIva/3

Gabriel Sadaka
  • 1,748
  • 1
  • 15
  • 19