jsPlumb 无法连接多个点

jsPlumb unnable to connect mutiple points

本文关键字:连接 jsPlumb      更新时间:2023-09-26

我正在尝试将jsPlumb版本1.4.1与jquery依赖项一起使用,将UI中的一些div绑定在一起。

我的初始代码:

jsPlumb.bind("ready", function() {
        var eclipse = jsPlumb.addEndpoint("java-eclipse");
        var netbeans = jsPlumb.addEndpoint("java-netbeans");
        jsPlumb.connect({
            source:eclipse,
            target:netbeans,
            connector:"Straight",
            paintStyle:{ lineWidth:5, strokeStyle:'rgba(0, 0, 200, 0.5)' },
            endpoint:"Dot",
            anchor:[ "Perimeter", { shape:"Circle" }]
        });
     });

它按预期工作,但是一旦我尝试添加更多端点以建立另一个连接:

//Innitial working endpoints
var eclipse = jsPlumb.addEndpoint("java-eclipse");
var netbeans = jsPlumb.addEndpoint("java-netbeans");
//Just adding these endpoints causes my script to crash
var javaSE = jsPlumb.addEndpoint("java-se");
var javaSW = jsPlumb.addEndpoint("java-sw");

这给我带来了以下错误:

Error: H is undefined
r@https://cdnjs.cloudflare.com/ajax/libs/jsPlumb/1.4.1/jquery.jsPlumb-1.4.1-all-min.js:1:9455

我不知道为什么我创建的第二组端点会导致整个事情崩溃,div 存在并具有正确的 id,并且查看 js 铅垂演示和文档建立两个单独的连接(se->sw 和 eclipse->netbeans)应该是可能的。

试试这个;

jsPlumb.connect({
        source:eclipse,
        target:netbeans,
        connector:"Straight",
        paintStyle:{ lineWidth:5, strokeStyle:'rgba(0, 0, 200, 0.5)' },
        endpoint:"Dot",
        anchor:[ "Perimeter", { shape:"Circle" }],
        maxConnections: -1
    });