我使用
arbor.js创建一个图.
如何为节点创建一个onclick事件,或者在单击节点链接之后建立节点链接?
Arborjs.org主页在点击时链接到外部页面的节点,如何复制这个节点,或者在节点点击时调用JavaScript函数?
我当前的节点和边缘列表采用以下格式:
var data = { nodes:{ threadstarter:{'color':'red','shape':'dot','label':'Animals'},reply1:{'color':'green','label':'dog'},reply2:{'color':'blue','label':'cat'} },edges:{ threadstarter:{ reply1:{},reply2:{} } } }; sys.graft(data);
一点上下文:
我使用arbor.js在我的论坛上创建一个线程启动器和回复的图形.
我已经工作,所以id被显示在他们各自的线程启动器周围的“轨道”.
在乔木网站上的参考确实不是很有帮助.
任何帮助深表感谢.
解决方法
如果你看看atlas演示代码(在
github),你会看到底部有一些鼠标事件功能,如果你看:
$(canvas).mousedown(function(e){ var pos = $(this).offset(); var p = {x:e.pageX-pos.left,y:e.pageY-pos.top} selected = nearest = dragged = particleSystem.nearest(p); if (selected.node !== null){ // dragged.node.tempMass = 10000 dragged.node.fixed = true; } return false; });
这用于控制默认节点“拖动”功能.在这里,您可以触发所需的链接.
我将链接URL添加到您要传回的节点json,以定义每个节点,因此您原始的JSON发布会变成如下:
nodes:{ threadstarter:{'color':'red','label':'dog',link:'https://stackoverflow.com'},'label':'cat',link:'https://stackoverflow.com'} },
然后,您可以更新mouseDown方法来触发链接(鼠标下方的当前节点为“selected”,以便您可以拔出链接,如selected.node.data.link
如果您查看主轴站点的原始源,以了解它们是如何完成的,那么它们具有在mouseDown事件上调用的单击函数,然后基本上是这样做的:
$(that).trigger({type:"navigate",path:selected.node.data.link})
(为您的目的编辑)
值得注意的是,虽然Arbor框架和演示文稿是开放使用的,但它们的网站不是,实际上是版权所有,所以只能阅读它们,看看它们是如何做到的,不要复制它);