如何解决D3 强制布局逐步更新
我已经修改了 D3 force layout example 并通过在计时器上加载(缓慢更改)数据使其动态
var inter = setInterval(function() {
d3.json("http://localhost:5000/my_data",drawGraph);
},5000);
这一切正常,但每 5 秒从起始位置重新绘制图形,这在视觉上会分散注意力。实际上,从一次迭代到下一次迭代几乎没有变化,我希望图表从其先前的位置开始重新布置。显然,当添加一个节点时,图形布局会发生变化;但我希望尽量减少视觉干扰,因为添加一个节点不应该在图中引起这么多的移动。
我该怎么做?
我尝试保存并重新加载图形节点的位置,但这没有任何作用。我应该保存并重新加载代表节点的 SVG 对象的位置吗? (在我的情况下:圆圈。) 或者我可以设置模拟开始移动节点的初始位置吗?
// Load the positions of the nodes,assuming they are available at this point
graph.nodes.forEach(function(o,i) {
if (nodePos.has(o.id)) {
o.x = nodePos.get(o.id).x
o.y = nodePos.get(o.id).y
console.log("< node " + o.id + ":" + o.x + "," + o.y)
}
});
// Compute the layout
var layout = d3.layout.force() // ... code omitted
drawLinks(graph.links);
drawNodes(graph.nodes);
// ...
// Save the positions of the nodes,assuming they are final at this point
graph.nodes.forEach(function(o,i) {
nodePos.set(o.id,{'x': o.x,'y': o.y});
console.log("> node " + o.id + ":" + o.x + "," + o.y)
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。