使用jsPlumb重新绘制endpoint

Question

我已经被这件事困扰了几天，希望你能帮助我解决这个问题。我创建了一个类似流程图的应用程序来绘制不同类型的铅锤项目，并将不同的endpoint连接到这些项目上。将其创建为元素后，将根据铅锤项目的类型动态添加endpoint。是这样的吗。

这就是我创建铅锤项目的方式。

    var element = document.createElement("div");
    element.setAttribute("id",schema_id);
    element.setAttribute("class","item " +control.Type);
    element.setAttribute("style","left:" +posX + "px ; top: "+posY+"px");

    var output = document.getElementById('container');
    output.appendChild(element);

然后根据endpoint的类型添加endpoint。

    jsPlumb.addEndpoint(element,<the style goes here>,{ anchor:<the location of the endpoint goes here>, uuid: <a new ID is created for this>});

这就是它看起来的样子

屏幕一

我设法从方法“GetConnections”中获取数据，并将其作为JSON保存在DB中。此JSON包括用于铅锤项目和所有endpoint的所有ID。

但是，当我尝试再次将其检索回UI时，它看起来是这样的。除了endpoint之外，一切看起来都很好。

第二屏

在重画时，endpoint的创建方式与上面提到的相同。要重新连接endpoint，我正在使用此代码。

    jsPlumb.connect({ source:<source id>, target:<target id>,anchors:<location of the endpoint>,<style>);

问题是：

对于上面的代码，尽管我将endpoint的UUID提供给了源和目标，但它没有将其标识为要连接的endpoint。

有没有办法找到ID并将其连接起来？我发现只有铅锤项目可以用UUID的“getElementById”搜索，而不是endpoint。

问题是如何使这些endpoint按照最初绘制的方式连接。如何重新连接每个endpoint？我有所有的ID，当它们被重新绘制时，它们的ID与保存时的ID相同。但是我找不到一种方法来分别重新连接endpoint，因为每个铅锤项目都有不同类型的endpoint。

有什么建议吗？

抱歉发了这么长的帖子，提前谢谢！！

Answer 1

请参阅连接方法

如果连接ID、元素或endpoint，请使用

 jsPlumb.connect({source:<source id>, target:<target id>}); 

但是如果你连接两个endpoint的UUID数组使用

jsPlumb.connect({uuids:<array of uuids>});