馅饼甜甜圈图表与不同的扇区大小

Question

大家好，

我期待创建如下图所示的图表。我正在谷歌搜索哪个图表可以选择创建这种类型的图表，没有完全类似于每个弧内的文本文本，但是为空。

我主要是在寻找chartjs，因为我是新手使用任何图表库，我还没有理解其中的选项，这意味着如果有人有建议，那对我有帮助。

全部谢谢

Answer 1

如果你想使用另一个库d3.js.你应该研究一下：

https://github.com/amanjain325/angular-d3-charts/tree/master/src/app/doughnut-chart

根据您的要求编辑半径值。

let pie = d3.layout.pie()
  .startAngle(Math.PI / 2)
  .endAngle(Math.PI * 2 + Math.PI / 2)
  .value((d) => {
    return d.value;
  }).sort(null);

let arc = d3.svg.arc()
  .outerRadius(150)
  .innerRadius(70);

let g = svg.selectAll('.arc')
  .data(pie(piedata))
  .enter().append('g')
  .attr('class', 'arc');

Answer 2

您可以使用ECharts。还有一个vue版本。他们有这种类型的图表。

另一种可能性是为这种图表创建一个chartjs插件。