0

私がする必要があるのは、ノードの位置（node.xとnode.yなど）を尊重し、それらの数に基づいて動的に距離を再計算するパス（またはパスなしの座標）にノードを挿入することです。

私は試した：

d3.scale.linear().domain([0,width]).range([height, 0]);

ただし、svg要素の対角線のみを計算します。これを達成する方法はありますか？私がやろうとしていることをよりよく理解するために、イメージイラストを同封します。ノードを直線的ではないパスに配置する方がさらに良いでしょうが、これを行う方法がわかりません。

パス上のノード

ありがとう

ルーカス

4

1 に答える 1

1

ノードの距離をその数だけ減らし、対角線のパスの長さに基づいて新しい距離を動的に計算することで、この動作を実現することができました。次のように、ユーザーに対して非表示のパスを追加します。

var points = [
                [0, height],
                [width, 0]                                                            
                ];


            var pth = svg.append("path")
                .data([[points]])
                .attr("class","diag")
                .attr("d", d3.svg.line()
                .tension(1)
                // Catmull–Rom
                .interpolate("basis"));

その長さを計算します:

halfDiagLength = pth.node().getTotalLength()/2;

次に、簡単に新しい距離を取得します。その後、対角関数を使用して x 座標と y 座標を設定します。

var x = d3.scale.linear().domain([0,width]).range([height, 0]);    
n.x = Math.round(l.source.x)+linkLength;
n.y = x(n.x);

それが誰かを助けることを願っています。

ルーカス

于 2012-04-18T15:19:42.853 に答える