我将我的D3.v3代码移植到最新的D3.v4。在数据更改后,我曾经多次调用我的渲染模拟功能(附加节点,附加链接等)。
现在,如果我再次调用我的渲染功能图形冻结,它不会调整新节点或链接,拖动也不会工作。
以下是jsfiddle中的代码
https://jsfiddle.net/za0xpdc5/4/
Graph.prototype.render = function() {
this.simulation = d3.forceSimulation()
.force("link", d3.forceLink().id(function(d) {
return d.id;
}))
.force("charge", d3.forceManyBody())
.force("center", d3.forceCenter(200, 200));
link = this.linksG
.selectAll("line")
.data(this.links)
.enter()
.append("line")
.attr("id", function(d) {
return d.id
});
node = this.nodesG
.selectAll("g")
.data(this.nodes)
.enter()
.append("g")
.attr("id", function(d) {return d.id;})
.append("circle")
.attr("id", function(d) {return "node_" + d.id})
.attr("r", 5)
.call(d3.drag()
.on("start", dragstarted)
.on("drag", dragged)
.on("end", dragended));
# ====================================
# <---- It appears the freeze occurs at this point
# during the 2nd execution of graph.render()
# ====================================
this.simulation.nodes(this.nodes).on("tick", this.tick);
this.simulation.force("link").links(this.links);
}