从 PrimeReact 更改圆环图的标签位置

Question

我是 React 新手，想更改 PrimeReact 甜甜圈图标签的位置（https://www.primefaces.org/primereact/#/doughnutchart）。

我检查了primereact内部用于图表的链接（https://www.chartjs.org/docs/latest/charts/doughnut.html），没有找到改变位置等的选项。有没有办法实现？

我还想在甜甜圈的中心添加一些文字。

蒂亚

Answer 1

这是图表 jsx：

const option = {
  maintainAspectRatio: false,
  responsive: false,
  legend: {
  position: 'left',
  labels: {
  boxWidth: 10
  }
 }
}

将以上选项应用于图表

<Chart
   style={{ width: "90%", height: "90%" }}
   type="doughnut"
   data={data}
   options={option}
 />

Answer 2

用户578219的答案也非常适合我的问题。 我也在寻找在甜甜圈中心包含标签的选项 - 在哪里可以找到可以使用的选项列表？

Answer 3

对于最新版本，您必须使用

  const optionsDonut = {
            maintainAspectRatio: false,
            responsive: false,
            plugins:{
                legend: {
                    position: 'left',
                }
            }
      }