Chart JS data labels getting cut

Question

I am using Chart JS with data label plugin and I want to show data labels next to the bar and pie chart but noticed that some of the data labels are getting cut or going out of canvas. Is their any way to fix this?

    var chartData3 = {
        labels: ["January", "February", "March", "April", "May", "June"],
    datasets: [{
      backgroundColor: "#79D1CF",
      data: [60, 90, 81, 56, 55, 40],
      datalabels: {
        align: 'end',
        anchor: 'end'
      }
    }]
  };

https://plnkr.co/edit/I906pCN8tdrrOX2hgN0W?p=preview

Thanks, MSK

Answer 1

You need to set padding to display the labels properly. Also, adjust the canvas width and height to account for padding so that your chart doesn't get too small.

options: {        
    layout: {
        padding: {
            left: 50,
            right: 50,
            top: 50,
            bottom: 50
        }
    }
}