indexLabelPlacement: String

Using this property you can define whether to render indexLabel “inside” or “outside” the dataPoint.

Default: Automatically handled
  • “inside” for stacked charts.
  • “outside” for pie/doughnut charts.
  • “auto” for all other chart types.
Example: “outside”, “inside”, “auto”
Note
  • If the indexLabelPlacement is inside, it is advised to have smaller labels or to reduce indexLabelFontSize so that indexLabels can be accommodated.
  • When set to “auto”, the chart automatically decides whether to place labels inside or outside based on the available space, except in pie/doughnut charts. Incase of pie/doughnut charts, “auto” sets indexLabelPlacement to “outside”.
  • In case of rangeColumn / rangeBar charts indexLabels are displayed at the extreme end when indexLabelPlacement is set to “inside” – because they have two indexLabels.
var  chart =  new  CanvasJS.Chart("container",
{
 .
 .
 data: [{
  indexLabelPlacement: "inside",

  },
 ]
 .
 .
});
chart.render();
Try Editing The Code

  Also See:    

If you have any questions, please feel free to ask in our forums.Ask Question

6 Comments

  1. Amer says:

    Hello,

    When I use the “inside” placement for stacked column chart, it shows the label attached to the top of column. Can I show it in the middle?

    Thanks

  2. gregori1978 says:

    Would you consider making bubble type charts compatible with indexLabelPlacement? Right now it seems only inside is available, but for some data (small bubbles, f.i., it would be great to been able to show the label outside. Thanks!

If you have any questions, please feel free to ask in our forums. Ask Question