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强制布局节点属性没有正确更新

回答

相关问题