Question

Manipulation methods of vis.js仅包含addNodeMode()，但不包括addNode()。我想知道是否有一些很好的方法可以在点击上创建一个节点。可能是通过操纵数据而不是网络本身？

当然，有人可能会去

network.on('click',function(params){
    if((params.nodes.length == 0) && (params.edges.length == 0)) {
        network.addNodeMode(); // doesn't add, one more click needed
        //# generate click in the same place. Use params.pointer.canvas
        //  or params.pointer.DOM to set appropriate coordinates
    }
})

但是我们还要防止无限循环，因为我们在点击处理程序中生成了一个click事件。

Answer 1

您可以使用update类的vis.DataSet方法动态添加节点。有关详细信息，请参阅此文档页面：http://visjs.org/docs/data/dataset.html#Methods

Answer 2

好的，这是我目前的实施：

...
data = ...
nodes = new vis.DataSet(data.nodes); // make nodes manipulatable
data = { nodes:nodes, edges:edges };
...
var network = new vis.Network(container, data, options);

network.on('click',function(params){
    if((params.nodes.length == 0) && (params.edges.length == 0)) {
        var updatedIds = nodes.add([{
            label:'new',
            x:params.pointer.canvas.x,
            y:params.pointer.canvas.y
        }]);
        network.selectNodes([updatedIds[0]]);
        network.editNode();
    }
})

它并不完美，因为它实际上创建了一个节点并开始编辑它，所以如果我们取消编辑，节点就会停留。它还会产生不需要的节点阴影。但它已经是一个足够开始的工作原型。

Vis.js网络：如何在画布内点击添加节点？

2 个答案: