如何使用d3.js在sunburst示例中获取每个弧的startAngle和endAngle？

Question

我想在旭日例子中得到每个弧的起点和终点角，如http://bl.ocks.org/4063423所示：

Answer 1

您可以在代码中看到它们：

var arc = d3.svg.arc()
    .startAngle(function(d) { return d.x; })
    .endAngle(function(d) { return d.x + d.dx; })
    .innerRadius(function(d) { return Math.sqrt(d.y); })
    .outerRadius(function(d) { return Math.sqrt(d.y + d.dy); });

所以你的起始角度在x属性中，x + dx给出你的结束角度。

技巧是x，dx，y和dy都由布局函数设置：

var partition = d3.layout.partition()
    .sort(null)
    .size([2 * Math.PI, radius * radius])
    .value(function(d) { return 1; });

sort（null）告诉它不要重新排序数据 size（...）告诉它x和y坐标的输出范围（半径是平方因为我们映射到一个区域）。 value（...）是如何对每个项目进行加权的值访问器。