Correct config for overlapping arcs in doughnut chart

[CodeWithOz]

What config can be used to achieve this overlapping effect (see pic below) where the black arc overlaps the next arc? The light green arc can be ignored, just assume the area of the light green arc is actually part of the gray arc.

The closest I've come is shown in the next pic below, and you can see that the arcs do not overlap. In fact when I try using an offset to make them overlap, the gray arc covers the black instead of the other way around.

So I'd like to know what config can achieve the desired overlap, thank you!

[nwamugo]

I am able to reproduce the arcs of the second image using chartjs, by adjusting the following properties.

options = {
borderWidth: 0,
cutout: "80%",
circumference: "270",
rotation: 225,
borderRadius: 1000,
spacing: -2,
};

I am also interested to find out if anyone can reproduce the first image

[seyfer]

@nwamugo https://www.youtube.com/watch?v=jWXQ7lsg-Yw&ab_channel=ChartJS

[Udemology]

Just combine video above with these below:
https://www.youtube.com/watch?v=C9EEhHZcLas&ab_channel=ChartJS
https://www.youtube.com/watch?v=4LFXFDgMBuc&t=3s&ab_channel=ChartJS

[Merzouk-Ilyes]

Or you can just use this :

datasets: [
{
...,
spacing: -40,
},

],