[Chartjs]-Chart.js – IndexSizeError: Index or size is negative or greater than the allowed amount

This is because your chart doesn’t have a finite size when it’s being created (i.e. when Chart(ctx).Doughnut is being called). The chart width and height are 0 and the outerRadius becomes -segmentStrokeWidth / 4 (this is 2 by default – hence the -0.5)

To fix this error make sure your canvas is visible and properly sized before creating the chart. For example, if the chart is in a tab, wait for the tab to be visible before creating the chart. If it is in an expanding panel, wait for it to be completely expanded (putting it in the callback function of the animation would be the right way to go about this)

You can replicate the error by setting the canvas size to 0

<canvas id="myChart" width="0" height="0"></canvas>

What seems to be happening in your case is that clearing the browser cache delays the chart rendering so that the canvas has the right size by the time the chart is created. An easy way to verify this would be to wrap your chart creation in a setTimeout with some delay.