D3中基于圆弧的文本对齐

Question

我正在尝试使用D3创建一个Radial Hub and Spoke diagram（http://bl.ocks.org/3169420），它使用饼图的弧来表示与上下文节点的关系和/或来自上下文节点的关系。换句话说，我正在尝试创建节点关系的360度视图。

在上面的示例中，“节点1”位于中心。我无法获得相关节点＃8 - ＃18的文本节点名称以对齐“车轮外”。有谁知道最好的方法是什么？

我正在使用的代码如下所示......

    // Add node names to the arcs, translated to the arc centroid and rotated.
    arcs3.filter(function(d) {
      return d.endAngle - d.startAngle > .2; }).append("svg:text")
        .attr("dy", "5px")
        .attr("angle", function(d) { return angle(d); })
        .attr("text-anchor", function(d) { return angle(d) < 0 ? "start" : "end"; })
        .attr("transform", function(d) { //set text'ss origin to the centroid
           // Make sure to set these before calling arc.centroid
           d.innerRadius = (height/2); // Set Inner Coordinate
           d.outerRadius = (height/2); // Set Outer Coordinate
           return "translate(" + arc3.centroid(d) + ")rotate(" + angle(d) + ")";
         })
        .style("fill", "Black")
        .style("font", "normal 12px Arial")
        .text(function(d) { return d.data.name; });

    // Computes the angle of an arc, converting from radians to degrees.
    function angle(d) {
      var a = (d.startAngle + d.endAngle) * 90 / Math.PI - 90;
      return a > 90 ? a - 180 : a;
    }

问题似乎是我需要评估节点标签放置位置的X和Y坐标。但是，我似乎无法正确查找/访问那些X和Y值。

提前感谢您提供的任何帮助。

我最好，

谢

Answer 1

感谢Ger Hobbelt ...简而言之，角度函数需要参数化：

    function angle(d, offset, threshold) {
      var a = (d.startAngle + d.endAngle) * 90 / Math.PI + offset;
      return a > threshold ? a - 180 : a;
    }

完整答案可以在d3.js Google Group找到：https://groups.google.com/forum/?fromgroups#!topic/d3-js/08KVfNmlhRo

我最好，

谢