Chart.js如何为每个数据集设置cutoutPercentages

Question

在图片中，我希望Dataset2比dataset1更厚。自定义甜甜圈图表如何图片？

Answer 1

我也在搜索此选项，尚未找到它。 现在，我添加了一个额外的数据集，其borderWidth：42使得以太的侧面成为内部数据或室外数据

datasets: [
  {
    data: [100],
    backgroundColor: ['#FFFFFF'],
    borderWidth: 42
  },
  {
    data: [50, 30, 20],
    backgroundColor: ['#64D28C', '#F49356', '#F45656']
  },
  {
    data: [memoryUsageValue, leftoverMemory],
    backgroundColor: [PercentageColor, '#FFFFFF']
  }
]

Colored borders to show how it works

Non colored border for result

Answer 2

此功能已在2019年的v2.8（https://github.com/chartjs/Chart.js/pull/5951）中添加。

您现在可以使用weight属性来分配数据集的相对宽度。

// following Timo Hulzenboom's example
datasets: [
  {
    data: [50, 30, 20],
    backgroundColor: ['#64D28C', '#F49356', '#F45656']
    weight: 0.33, // will be half as thick
  },
  {
    data: [memoryUsageValue, leftoverMemory],
    backgroundColor: [PercentageColor, '#FFFFFF']
    weight: 0.67,
  }
]

编辑：位于https://www.chartjs.org/docs/latest/charts/doughnut.html#styling

的其他文档

Answer 3

有分量：可能您可以添加数据集