[Chartjs]-Chart.js cuts off canvas – but padding makes doughnut very small

I found that the plugins part of your code was causing most of the problem.

I experimented with the additional height being set in the plugins so that your plugins and options look like this:

options: {
  cutoutPercentage: 85,
  layout: {
    padding: {
      bottom: 5
    }
  },
  legend: {
    labels: {
      fontColor: '#384241',
      boxWidth: 7,
      fontFamily: "'arla-thin'"
    }
  }
},
plugins: [{
  beforeInit: function (chart, options) {
    chart.legend.afterFit = function () {
      this.height = this.height + 5;
    }
  }
}]

I also changed the #usersChart css to margin-bottom: 20px; to reduce the gap.

Here’s what it looks like on a Galaxy S5.