Javascript 如何从springy.js和raphael中完全删除edge?
我正在尝试使用springy和raphael开发一个javascript应用程序。 事实上,我分叉了demo-raphael.html(可从官方springy代码获得) 我试图做的是有2个主节点A和B以及10个其他节点(C、D、E,…)。 这10个节点可以连接到A或B(但不能同时连接到两者) 如果我选中一些复选框,一些节点可以更改它们的连接并转到另一个主节点 所以我所做的似乎是有效的,除了她,比如说,A和C之间的界限没有被移除。 更新复选框后,我会运行: 我假设A连接到C,我想把它断开,然后把B连接到C。让我们把这个边称为EC。 所以我跑了Javascript 如何从springy.js和raphael中完全删除edge?,javascript,raphael,springy.js,Javascript,Raphael,Springy.js,我正在尝试使用springy和raphael开发一个javascript应用程序。 事实上,我分叉了demo-raphael.html(可从官方springy代码获得) 我试图做的是有2个主节点A和B以及10个其他节点(C、D、E,…)。 这10个节点可以连接到A或B(但不能同时连接到两者) 如果我选中一些复选框,一些节点可以更改它们的连接并转到另一个主节点 所以我所做的似乎是有效的,除了她,比如说,A和C之间的界限没有被移除。 更新复选框后,我会运行: 我假设A连接到C,我想把它断开,然后把
graph_removeEdge(EC);
delete EC;
EC = graph.newEdge(C, B, {color: '#00A0B0'});
代码似乎可以工作,因为B和C是连接的,而A和C不再连接。
但我仍然可以看到A和C之间的线的旧图片(它不会再移动了,但它仍然在那里)
我怎样才能去掉它
我还试图不删除和创建此EC边缘,但试图通过更改其目标节点来更新它,但什么也没有发生。
代码:
还有一个问题是我如何在a和B之间设置最大距离。
因为他们可能非常接近
非常感谢您的帮助。好的,我遇到了问题:
springy正在创建节点和边,但它也创建与此边关联的raphael路径。
因此,在销毁边缘之前,必须删除此路径
EC.connection.fg.remove();
graph_removeEdge(EC);
注意:关于在a和B之间设置最大距离的第二个问题:如果不在springuy库中进行修改,则无法执行此操作,因为a和B之间没有链接,因此我们无法设置距离。
唯一的解决方案是为每个节点添加一个标志,然后将分发具有该标志的节点。当然,这必须通过springuy.js中的修改来实现,可能是在以下函数中:
Layout.ForceDirected.prototype.tick = function(timestep) {
this.attractToCentre();
this.applyHookesLaw();
this.applyCoulombsLaw();
this.applyDistanceToFlaggedNode(); // <--- your new function
this.updateVelocity(timestep);
this.updatePosition(timestep);
};
Layout.ForceDirected.prototype.tick=函数(timestep){
这个.attracttocenter();
这个。applyHookesLaw();
这个.applyCoulombsLaw();
这个.applyDistanceToFlaggedNode()//
Layout.ForceDirected.prototype.tick = function(timestep) {
this.attractToCentre();
this.applyHookesLaw();
this.applyCoulombsLaw();
this.applyDistanceToFlaggedNode(); // <--- your new function
this.updateVelocity(timestep);
this.updatePosition(timestep);
};