D3.jsフォースグラフのノードデータを更新する方法は？

Question

私は、データ変更時に複数のノード属性と追加された要素を更新する方法を探しています。

ここで私は今それをやろうとしています。 この関数は、毎回呼び出されるノードまたはデータのリンクを取得します。

function restart() { 

    link = link.data(links); 

    link 
    .enter().insert("line", ".node") 
    .attr("class", "link") 
    .on('click' , function(d, i){ 
     console.log(d); 
     links.splice(i,1); 
     restart(); 
    }) 
    .on("mouseover", function() { 
     d3.select(this).style("stroke","red"); 
     d3.select(this).style("stroke-width","5px"); 
    }) 
    .on("mouseout", function() { 
     d3.select(this).style("stroke","#999"); 
     d3.select(this).style("stroke-width","initial"); 
    }); 

    link 
    .exit().remove(); 

    node = node.data(nodes); 

    node 
    .enter() 
    .append("g") 
    .attr("class", "node") 
    .call(node_drag); 

    node 
    .insert("circle", ".cursor") 
    .attr("r", function(d) { return calcSize(d.links+1); }) 

    node 
    .append("text") 
    .attr("dx", 12) 
    .attr("dy", ".35em") 
    .text(function(d) { return d.links }); 

    node 
    .exit().remove(); 

    force.start(); 

} 

現在の状態での完全なコードはここで見ることができます：http://jsbin.com/takatugazo/edit?html,js,output

予想される動作は、2つのノードが互いの中にドラッグを取得するとき、彼らは彼らに大きなを持ってリンクしてより多くのリンクを作成することです取得する。

Answer 1

あなたの追加テキストは更新中です。唯一の問題は、古いテキストを置き換える代わりに、<text>要素を追加しているようです。ノードを調べるだけで、リンク数に基づいて複数の<text>要素が見つかります。何らかの理由で、コードがテキストを更新する必要がありません。

使用すると、1つ追加する前にテキスト要素を削除してください：私はJSごみ箱でそれらの変更を行っ

node.select("text").remove() 

node 
.append("text") 
.attr("dx", 12) 
.attr("dy", ".35em") 
.text(function(d) { return d.links }); 

node 
.exit().remove(); 

をし、（遅延のビットで）私のために働くようだ：そこhttp://jsbin.com/goqumutelu/edit?html,js,output

遅延が欲しくない場合：タイムアウトを削除するか、遅延値（1500）を0に置き換えるだけで、それを解決する必要があります：http://jsbin.com/hazecozumu/1/edit?html,js,output

A boutノードのサイズ、何が間違っているのですか？どのように更新したいのですか？