jsPlumb中,把已经绑定好以后的锚点通过deleteEndpoint方法删除以后,同时DOM节点也通过remove()删除以后,再次创建DOM节点和锚点以后,锚点和节点始终绑定不上,如何解决
时间: 2024-04-21 21:23:05 浏览: 273
如果在使用 jsPlumb 删除锚点 (`deleteEndpoint`) 和相关的 DOM 节点 (`remove`) 后再重新创建节点和锚点,但无法成功绑定,可能是因为 jsPlumb 仍然保留了之前绑定的一些状态信息,导致新创建的节点和锚点无法正确绑定。
为了解决这个问题,你可以尝试在删除节点和锚点后,使用 `jsPlumb.reset()` 方法来重置 jsPlumb 的状态。这个方法将会清除所有之前的绑定和状态信息,使得你能够重新创建节点和锚点并正确地进行绑定。
下面是一个示例代码:
```javascript
// 删除节点和锚点
jsPlumb.deleteEndpoint(endpoint);
node.remove();
// 重置 jsPlumb 状态
jsPlumb.reset();
// 创建新的节点和锚点
var newNode = $('<div>').attr('id', 'newNode');
$('#container').append(newNode);
jsPlumb.makeTarget(newNode, targetOptions);
jsPlumb.makeSource(newNode, sourceOptions);
```
通过调用 `jsPlumb.reset()` 方法,你可以确保之前的状态被正确清除,从而能够重新创建并正确绑定新的节点和锚点。
相关问题
jsplumb中锚点不进入节点内部,只在节点边缘及节点外部
在 jsplumb 中,如果您要使用锚点,可以通过设置锚点参数来控制其位置。默认情况下,锚点会在节点的边缘处,但是如果您想要将锚点放在节点内部,您可以尝试使用 `anchorOffset` 参数,它可以指定锚点相对于节点中心的偏移量。例如,将 `anchorOffset` 设置为 `{left:0.5,top:0.5}` 将使锚点位于节点的中心。
以下是一个示例代码片段,演示如何在节点内部设置锚点:
```javascript
jsPlumb.addEndpoint('node1', {
anchor: [1, 0.5, 1, 0],
endpoint: "Dot",
paintStyle: {
fill: "#7AB02C",
radius: 7
},
connector: ["Flowchart", { stub: [40, 60], gap: 10, cornerRadius: 5, alwaysRespectStubs: true }],
connectorStyle: {
stroke: "#61B7CF",
strokeWidth: 2
},
connectorHoverStyle: {
stroke: "#216477"
},
hoverPaintStyle: {
fill: "#216477",
stroke: "#216477"
},
anchorOffset: {left:0.5,top:0.5}
});
```
在上面的代码中,我们将 `anchor` 设置为 `[1, 0.5, 1, 0]`,这表示将锚点放在节点的右侧中心位置。然后,我们将 `anchorOffset` 设置为 `{left:0.5,top:0.5}`,这将使锚点相对于节点中心偏移了一定的距离,从而将锚点放在节点内部。
希望这可以帮助到您!
jsPlumb通过UUID删除锚点后,再重新绘制锚点
您可以使用以下步骤在jsPlumb中删除并重新绘制锚点:
1. 获取要删除的锚点的UUID。
2. 使用jsPlumb的`deleteEndpoint`方法删除锚点。该方法接受锚点的UUID作为参数。
例如:`jsPlumb.deleteEndpoint(endpointUUID);`
3. 重新绘制锚点。您可以使用jsPlumb的`makeSource`或`makeTarget`方法来创建新的锚点。
例如:`jsPlumb.makeSource(element, sourceOptions);`
`jsPlumb.makeTarget(element, targetOptions);`
其中`element`是要创建锚点的元素,`sourceOptions`和`targetOptions`是锚点的配置选项。
请注意,上述代码片段中的变量和选项应根据您的实际情况进行相应的更改。
阅读全文