Change the Center color of doughnut chart in Chart.Js

Question

Is there a way to change the color of the middle circle in Chart.Js? I don't seem to find it on their documentation?

Answer 1

The background is transparent. I think you can't really color the midle circle.. The main option is to put a background color on canvas or chart but all the white spaces will be colored.

Answer 2

其透明，带有背景色

Answer 3

Use chart.js 3.8

const colorcenter = {
  id: 'colorcenter',
  beforeDraw(chart, args, options) {
    const {ctx, chartArea: {top, right, bottom, left, width, height}} = chart;
    const radius = chart._metasets[0].controller.innerRadius;
    const x = chart.getDatasetMeta(0).data[0].x;
    const y = chart.getDatasetMeta(0).data[0].y
    ctx.arc(x, y, radius, 0, 2 * Math.PI);
    ctx.fillStyle = options.backgroundColor;
    ctx.fill();
  }
}