添加Edge动态visjs

Question

任何人都可以帮助我在这个visjs网络中动态添加边缘吗？实际上，我正在尝试使用拖放操作将节点添加到画布，但是当我单击节点并将边缘动态添加到画布上现有的另一个节点时，我需要帮助添加边缘。

Answer 1

您可以使用vis.js'update'函数动态添加节点或边。您只需传入一个数组，其中包含您尝试添加的节点或边的集合。你这样称呼它：

nodes.update(updateNodesArray)

要么

edges.update(updateEdgesArray)

其中nodes和edges是您最初为网络创建的vis.DataSet实例。

完整的文档可以在http://visjs.org/docs/data/dataset.html找到

Answer 2

这个答案的目的是帮助我自己停止谷歌搜索，因为我显然一直忘记解决方案，并一直在这里结束......

从技术上讲，它也是这个问题的答案：

function AddEdge(from_id, to_id)
{
    network.body.data.edges.add([{from: from_id, to: to_id}])
}

它的工作原理是网络数据节点是一个可见数据集，并且更新它（也通过添加/删除方法）也将更新渲染。

Answer 3

从visjs查看这个例子。 http://visjs.org/examples/network/other/manipulation.html

您可以通过配置网络自定义添加\编辑\删除的方式，如下所示：

manipulation: {
        enabled: false,
          addNode: function (data, callback) {
              // filling in the popup DOM elements
              console.log('add', data);
          },
          editNode: function (data, callback) {
              // filling in the popup DOM elements
              console.log('edit', data);
          },
          addEdge: function (data, callback) {
              console.log('add edge', data);
              if (data.from == data.to) {
                  var r = confirm("Do you want to connect the node to itself?");
                  if (r === true) {
                      callback(data);
                  }
              }
              else {
                  callback(data);
              }
          }
      }

Answer 4

var network = new vis.Network(container, datas, options)
//And then
network.addEdgeMode();

您可以通过拖放创建边