D3 Force布局 - 更新节点并维护力布局

Question

当底层数据发生变化时，如何使用新节点更新D3.js强制布局。目前，我能够生成力布局，并且所有节点都能很好地在图表上稳定下来。如果我通过删除，添加或编辑节点来更改基础数据，我该怎么做并保持强制布局，即节点在分配的图表空间中自行建立。

以下是我的代码的一部分，它将节点（圆圈）绘制到图表上：

var nodeCirclesInner = svg.selectAll("#innerCircle")
    .data(nodes, getPositionKey);

nodeCirclesInner
    .exit()
    .remove()

nodeCirclesInner
    .transition()
        .duration(1000)
        .attr("r", function(d) { return d.radius; })
        .attr("cx", function(d) { return d.cx; })
        .attr("cy", function(d) { return d.cy; })
        .style("fill", function(d) { return d.color; }) 
        .style("stroke", function(d) { return d3.rgb(d.color).darker(2); })

inner = nodeCirclesInner
    .enter()
    .append("circle")
    .attr("id", "innerCircle")
    .attr("class", "node_circle")
    .attr("r", function(d) { return d.radius; })
    .attr("cx", function(d) { return d.cx; })
    .attr("cy", function(d) { return d.cy; })
    .style("fill", function(d) { return d.color; })
    .style("stroke", function(d) { return d3.rgb(d.color).darker(2); })
    .on("mouseover", mouseOver)
    .on("mouseout", mouseOut)       
    .call(force.drag);

问题在于转型。我设置的X和Y坐标很好，但导致许多节点重叠。我希望节点在图表上“稳定”，而不会像最初生成图表时那样重叠。

从基础数据中删除的节点将从布局中正确删除。