Can one fill the background of the Axis of a radar Chart?

Can I fill the Background of a Radar Chart like in the picture below?

I'm Using Chart.js version 3.9.



My code for now looks like this:


this.chart = new Chart(spiderChart as ChartItem, {
type: 'radar',
data: this.data,
options: {
scales: {
r: {
ticks: {
backdropColor: 'rgba(0,0,0,0.01)',
},
angleLines: {
display: true,
color: 'rgba(255,255,255,0.1)',
},
grid: {
circular: true,
color: 'rgba(255,255,255,0.1)',
},
suggestedMin: 0,
suggestedMax: 4,
},
},
responsive: true,
elements: {
line: {
borderWidth: 1,
borderJoinStyle: 'round',
borderCapStyle: 'round',
},
point: {
pointStyle: 'circle',
borderColor: 'rgba(255,255,255,0.1)',
},
},
},
});



I want to color the backgrounds of the axes (not the axes themselves).

Continue reading...