Javascript d3.js绘制线源和目标不同（从d3.svg.arc（）生成的弧到具有基数位置的节点）

我在ATTTTEMP中添加了一些文本，其中包含rect

对于

Sunburst

，内弧环x，y表示角度和半径，但是

Sunburst

内的矩形由

基数位置表示

对于绘制线条，我知道我可以使用d3.svg.line或d3.svg.diagonal。但它们的源和目标是同一类型的

但是在我的例子中，
source
和
target
中的x，y是不同的

我该怎么办

我知道我可以将内部矩形更改为圆弧位置，以便源和目标可以匹配

但是有什么好方法可以做到这一点吗

欢迎提供任何建议。
自定义d3.svg.diagonal（）的源和目标。
用不同的方法变换源和目标的空间

var diagonal = d3.svg.diagonal()
                        .source(function (d) {
                            var innerRadius = Math.max(0, y(d.source.y));
                            var arcCenter = x(d.source.x + d.source.dx/2.0);

                            return {"x": innerRadius * Math.cos(Math.PI - arcCenter),      //radial space
                                "y": innerRadius * Math.sin(Math.PI - arcCenter)};
                        })
                        .target(function (d) {                                           //normal space
                            return {"x": d.target.y + rect_height / 2,
                                "y": d.source.x ? d.target.x : d.target.x + rect_width};
                        })
                        .projection(function (d) {
                            return [d.y, d.x];
                        });