使用 jsPlumb 重绘端点答案

【问题标题】：Redrawing endpoints using jsPlumb使用 jsPlumb 重绘端点
【发布时间】：2015-03-26 06:54:11
【问题描述】：

我已经被这个问题困扰了几天，希望您能帮助我了解如何解决这个问题。我创建了这个应用程序，类似于流程图，以绘制不同类型的铅垂项目，并附有不同的端点。在它被创建为元素之后，端点会根据铅垂项目的类型动态添加。是不是像下面这样。

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

    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);

然后我根据它的类型添加端点。

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

这就是它的样子

Screen One

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

但是当我尝试再次将其检索回 UI 时，它看起来像这样。除了端点，一切看起来都很棒。

Screen Two

重绘时，端点的创建方式与上述相同。要重新连接端点，我正在使用此代码。

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

问题：

对于上面的代码，虽然我将端点的 UUID 提供给源和目标，但它并没有将其标识为要连接的端点。

有没有办法找到 ID 并将它们连接起来？我发现只有带有 UUID 的“getElementById”可以搜索铅垂项目，但不能搜索端点。

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

有什么建议吗？

抱歉，帖子太长了提前谢谢你！

【问题讨论】：

标签： angularjs jsplumb endpoints

【解决方案1】：

请看the connect method

如果你连接 ids、元素或 Endpoints 使用

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

但如果您连接两个端点的 UUID 数组，请使用

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

【讨论】：

谢谢。 jsPlumb.connect({uuids:});做的工作:)