Inconsistent Doughnut Arc Spacing

[jjstanton]

Expected behavior

Consistent spacing between arcs greater than 1. If only one arc, no spacing is required.

Current behavior

Inconsistent spacing between arcs and spacing on singular arcs.

Reproducible sample

https://codepen.io/JJStanton/pen/YzrjRVw

Optional extra steps/info to reproduce

No response

Possible solution

No response

Context

No response

chart.js version

v3.7.0

Browser name and version

Chrome - Version 97.0.4692.71

Link to your project

No response

[etimberg]

To fix this we probably need to change how the spacing works. Right now it moves the arcs away from the center of the canvas by the spacing amount. Thus is doesn't provide any guarantees about what the space between the ends of the arc is. If we want to provide a consistent spacing in that direction we'll need to shrink the angles to create the space rather than moving the arcs away from the center

[cotwitch]

Just reached this issue. I'm also unable to code graph in a following way :(

[ArthurGorbenko]

Facing the same issue

[cotwitch]

I’ve ended up using default spacing while letting poor graphic designer screaming in agony.

[spaghettiguru]

As a possible workaround you can interlace values with the 'spacer' values and use transparent background color on them. This works better for thinner doughnuts. See my comment here https://github.com/chartjs/Chart.js/issues/10286#issuecomment-1410946775

[sammyaxe]

Still an issue. Any plans fixing this?

[jasperdunn]

Still an issue

datasets: {
        doughnut: {
          borderWidth: 0,
          spacing: 2,
        },
      },

[jjstanton]

@etimberg Any chance we can have this item looked at?