使用扇区d3js构建饼图

Question

我想用d3js构建这种图表（不需要在任何北方，东方等） 只是这种数据

[{year：2017，data：[10,20,30]}，{year：2016，data：[20,20,30]}] 有扇区的例子吗？ 感谢。

Answer 1

我认为可能类似于你想要的是：

Sequential Sunburst Diagrams

在d3js的主图库中，您可以找到 sunburst 图表的一些示例

Answer 2

D3提供了一种生成具有不同宽度的弧段的方法，该弧段由内半径和外半径，起始角和终止角d3.arc

指定

var arc = d3.arc();

arc({
  innerRadius: 0,
  outerRadius: 100,
  startAngle: 0,
  endAngle: Math.PI / 2
});

为了创建您想要的图表，您需要确定每个数据段的属性。通常使用布局功能来实现。您将数据数组传递给该函数，它返回创建弧段所需的值和数组。

将数据值转换为圆弧属性的过程是困难的工作所在。我已经创建了a bl.ock giving an example of how you might do this，但是，如果您使用的是这种布局，则应确保面积（而不是弧线厚度）与我没有的权宜之计成正比。