ChartJS“半甜甜圈”图表无法正确显示

Question

我的图表无法正确显示，以下是它的显示方式以及它应该如何显示：

显示方式：

它应该是什么样子：

我的html代码：

<div style="display:block; width: 400px; height: 400px">
    <canvas id="dashboardChart" width="400" height="400"></canvas>
</div>

我的打字稿组件代码：

var data = {
      datasets: [{
        data: [10, 20, 30]
      }],
      labels: [
        'Red',
        'Yellow',
        'Blue'
      ]
    };

    var ctx = document.getElementById("dashboardChart") as HTMLCanvasElement;
    var myDoughnutChart = new Chart(ctx, {
      type: 'doughnut',
      data: data,
      options: {
        rotation: 1 * Math.PI,
        circumference: 1 * Math.PI
      }
    });

如果有人可以提供帮助，我们将不胜感激。

Answer 1

甜甜圈旋转选项现在以度为单位

尝试以下更改：

circumference: 180,
rotation: -90,

迁移文档