与D3有关的Docuburst式旭日形图？

Question

Docuburst可用于生成此类图表：

看起来Docuburst是用Prefuse编写的，而不是写在D3中。

此图类似于使用分区布局的众所周知的D3图:(最大的区别是显示标签的方法）

是否有任何D3分区布局（sunburst）示例支持第一张图片中显示的圆形标签？

如果你想要一些没有标签处理的例子，那么这里是jsfiddle，取自another Q&A;还有一个jsfiddle，这个已经带有标签。

---

这是我正在研究的D3中的一个小测试示例：

jsfiddle

我设法将文本置于圆形区域中心，但现在我需要找到正确的文字大小。

Answer 1

您可以非常轻松地在arc path上运行文字。

group.append("svg:text")    
    .attr("dx", function (d) {
        var c = arc.centroid(d);
        return c[0];
    })
    .attr("dy", "30")
    .append("textPath")
    .attr("xlink:href", function(d){
        return "#" + d.name;
    })
    .text(function (d) {
        return d.name;
    });

其中xlink:href是路径的id。 *注意**我在这里作弊，只是使用名称，所以要小心它可能不是唯一的：

.attr("id", function(d){
    return d.name;
})

这是一个更新的fiddle。

在那个例子中，只有3个文字符合弧线，当它不适合时会变得疯狂。因此，next step would be to compare路径的大小为{{3}}，如果不适合，则将文字旋转。