2

ここで奇妙なことをしているわけではありません。しかし、それらを円の外縁と一致させることができないようです。どんな助けでも大歓迎です。

        // Create Nodes
    var node = svg.selectAll(".node")
        .data(force.nodes())
        .enter().append("g")
        //.group(d.group)
        .attr("class", "node")
        .on("mouseover", nodeMouseover)
        .on("mouseout", nodeMouseout)
        .call(force.drag);

    // Append circles to Nodes
    var circle = node.append("circle")
        .attr("r", 8)
        .style("stroke", function (d) { return d.BaseColor; })
        .attr("id", function (d) { return d.ID; })
        var link = svg.selectAll(".link")
        .data(force.links())
        .append("line")
        .attr("class", "link arrow")

    // Draw lines for Links between Nodes
    var link = svg.selectAll(".link")
        .data(force.links())
        .append("line")
        .attr("class", "link arrow")
4

1 に答える 1

3

svg では、作成された最新のオブジェクトが前面に表示されるため、通常、ノードの前にリンクを作成します。リンクはデフォルトでノードの中心に接続されます。たとえば、ノードの不透明度を変更してわずかに透明にすると、これを確認できます。

// Draw lines for Links between Nodes
var link = svg.selectAll(".link")
    .data(force.links())
    .append("line")
    .attr("class", "link arrow")

// Create Nodes
var node = svg.selectAll(".node")
    .data(force.nodes())
    .enter().append("g")
    //.group(d.group)
    .attr("class", "node")
    .on("mouseover", nodeMouseover)
    .on("mouseout", nodeMouseout)
    .call(force.drag);

// Append circles to Nodes
var circle = node.append("circle")
    .attr("r", 8)
    .style("stroke", function (d) { return d.BaseColor; })
    .attr("id", function (d) { return d.ID; })
于 2013-01-13T16:07:24.153 に答える