Pie / doughnut full responsive width

I first thought this was an issue with the original chartjs, but found out that the following is an issue with react-chartjs-2:

When creating a pie or doughnut chart, the full width is not utilized.

When using vanilla chartjs, as you can see on this codepen, the full available width gets used, which increases the size of the chart. In the demonstrations of react-chartjs-2 you can see that pie/doughnut charts are reduced in size because they do not utilize the full width. Try viewing this on a mobile device (or with your browser’s developer tools in responsive mode). The chart becomes very small in size and could’ve been bigger.
A solution is indeed by changing the sizes manually, but this defeats the purpose of being a responsive chart.

Why is the pie/doughnut chart not utilizing the full width available of its parent container?

[storesbuzz]

I too had same issue with doughnut chart, inner circle not getting full width. getting shrink leaving 90% side space blank.

I changed these two value and it’s full width now. responsive: true, maintainAspectRatio: false,

[JHanLu]

options = {
  legend: {
    display: false
  }
}

Works for me!