D3強制佈局節點屬性沒有正確更新

我有不同日子的網絡數據，我繪製爲每天的力指向圖。當我按下按鈕時，網絡部分地被刪除（節點被刪除，新的節點被繪製）到第二天。除了一件事以外，一切工作都很好。D3強制佈局節點屬性沒有正確更新

對於每一個新的一天，我從我的數據（例如節點度）更新我的節點數組的一些屬性。這也可以正常工作，因爲當我切換到第二天後查看節點數組時，我可以看到屬性已被正確更新。然而，命令

 `.append("circle").attr("r", function(d) { return 2*d.Degree+10; })`

不與新的屬性進行，並且節點的半徑不通過該節點的在日期的程度的圖表顯示代表。

如何更新我的圖形，使Degree的新值用於定義節點的半徑？

這裏是我的功能開始（），這是我操作我的數據後，調用繪製圖：

function start() { 

var force = d3.layout.force() 
    .charge(-130) 
    .linkDistance(230) 
    .size([width, height]); 

force.nodes(nodes) 
    .links(edges) 

linkOP = linkOP.data(edges, function(d) { return d.source.id + "-" + d.target.id; }); 
linkOP.enter().insert("line", ".node1") 
    .attr("class", "link1") 
    .style("stroke-width", function(d) { 
     return 2*d.weight.weight; 
     }); 
linkOP.exit() 
    .remove(); 

nodeOP = nodeOP.data(nodes, function(d) { return d.id;}); 
nodeOP.enter() 
    .append("g") 
    .append("circle") 
    .attr("r", function(d) { return 2*d.Degree+10; }) 
    .attr("class", "node") 
    .style("fill", function(d) { return color(d.bipartite); }); 

nodeOP.append("title").text(function(d) { return d.name; }); 
nodeOP.call(force.drag); 
nodeOP.append("text") 
    .text(function(d) { return d.id; }); 
nodeOP.moveToFront(); 
nodeOP.exit().remove(); 

force.start(); 

clean(); 

force.on("tick", function() { 
    linkOP.attr("x1", function(d) { return d.source.x; }) 
     .attr("y1", function(d) { return d.source.y; }) 
     .attr("x2", function(d) { return d.target.x; }) 
     .attr("y2", function(d) { return d.target.y; }); 

    nodeOP.attr("cx", function(d) { return d.x; }) 
     .attr("cy", function(d) { return d.y; }); 

    nodeOP.attr("transform", function (d) { 
     return "translate(" + d.x + "," + d.y + ")"; 
    }); 

}); 

}

我知道這是一個很簡單的問題......非常感謝你們的幫助！

來源

2014-05-23 Schaark

您的代碼沒有半徑更新。所有由.enter（）調用的東西只發生在新項目中。因爲你只有這條線

.append("circle").attr("r", function(d) { return 2*d.Degree+10; })`

.enter部分只出現在新節點上。

我在輸入，更新，退出時建立了一個jsfiddle。這裏：http://jsfiddle.net/TheMcMurder/H3HTe/

我希望可以幫助

來源

2014-05-23 18:51:48 TheMcMurder

嘿，男士，非常感謝您的快速回復。根據你的例子，我添加了：'var node_array = svg1.selectAll（「circle」）。data（nodes，function（d）{return d.id;}）; node_array.attr（「r」，function（d）{return 2 * d.Degree + 10;}）;'在行之前：'nodeOP = nodeOP.data（nodes，function（d）{return d.id;}）;'在我的啓動功能。現在我看到未更新的節點的大小正在改變，但仍然不是這樣，以致它們表示與它們相關的屬性。這對我來說很奇怪，因爲當我在瀏覽器中查看nodeOP數組時，所有屬性都被正確定義。 – Schaark

發現我的錯誤！非常感謝dawg，並且有一個愉快的週末（你真的殺了那個問題，這很適合你的名字！）。 Stackoverflow規則！ – Schaark

D3強制佈局節點屬性沒有正確更新

回答

相關問題