vis.js:如何通过鼠标单击展开/折叠节点

时间:2015-02-18 23:09:10

标签: javascript chap-links-library

现在只需要玩vis.js一天,并浏览所有文档和示例。我正在尝试找出使用点击事件刷新节点和边缘数据的最佳方法。例如。说我有一个没有边的节点,然后我点击它添加3个子节点。 vis.js专家可以建议最好的方法吗?

之前的预期:

nodes = [{id: 1,   label:"Parent Node"} ];
edges = [ ];

预计点击ID 1后:

nodes = [{id: 1,   label:"Parent Node"},
{id: 2,   label:"Child Node1"},
{id: 3,   label:"Child Node2"},
{id: 4,   label:"Child Node3"} ];
edges = [ {from: 1, to: 2},
          {from: 1, to: 3},
          {from: 1, to: 4} ];

然后我想要崩溃并返回到没有子节点的父节点。我得到了如何进行事件处理,它是更新和重绘节点和边缘,我不确定。

1 个答案:

答案 0 :(得分:4)

我发布后,我发现了自己的错误,没有使用动态DataSet()。 所以它应该是这样的:

var nodes = new vis.DataSet([{id: 1,   label:"Parent Node"}]);
var edges = new vis.DataSet([]);

然后你可以像这样更新:

nodes.update({id: 2,   label:"Child Node1"});
nodes.update({id: 3,   label:"Child Node2"});
nodes.update({id: 4,   label:"Child Node3"});

edges.update({from: 1, to: 2});
edges.update({from: 1, to: 3});
edges.update({from: 1, to: 4});