在jsplumb中移动连接器边缘
是指通过拖动连接器的端点来调整连接器的位置，使其与元素的边缘对齐或连接到指定的位置。
jsplumb是一个流行的前端开发库，用于创建可视化的连接器和流程图。它提供了丰富的功能和API，使开发者能够轻松地创建和管理连接器。
移动连接器边缘的操作可以通过以下步骤完成：
- 首先，需要在jsplumb中创建连接器。连接器可以是直线、曲线或其他自定义形状。
- 然后，可以通过拖动连接器的端点来移动连接器的位置。连接器的端点可以与元素的边缘对齐或连接到指定的位置。
- 在移动连接器边缘时，可以使用jsplumb提供的吸附功能来帮助对齐连接器和元素的边缘。吸附功能可以根据设定的吸附距离将连接器端点自动对齐到最近的元素边缘。
- 另外，还可以使用jsplumb提供的锚点功能来指定连接器端点的连接位置。锚点可以是元素的边缘、中心点或自定义位置。
移动连接器边缘在可视化编辑器、流程图、拓扑图等应用场景中非常常见。它可以帮助用户精确地调整连接器的位置，使其符合设计要求。
腾讯云提供了一系列与云计算相关的产品，其中包括云服务器、云数据库、云存储等。这些产品可以帮助开发者快速搭建和部署应用程序，并提供高可用性、可扩展性和安全性。
腾讯云产品链接：
- 云服务器（https://cloud.tencent.com/product/cvm）
- 云数据库（https://cloud.tencent.com/product/cdb）
- 云存储（https://cloud.tencent.com/product/cos）
请注意，以上答案仅供参考，具体的技术实现和推荐产品应根据实际需求和情况进行评估和选择。
相关·内容
1回答
我正在使用其他一些示例具有可移动的连接，但它们也使用节点上的特定端点。我喜欢这个特定的示例，在这个示例中，我可以将连接端点拖动到目标节点的任何点。
浏览 14提问于2017-07-15得票数 1
回答已采纳
我使用的是jsPlumb 5x的流程图应用程序。使用的包是@jsplumb/connector-流程图和@jsplumb/browser-ui。我决定使用流程图连接器。我找不到更改连接器布局的方法。 ? 有没有办法改变样式，使新的布局看起来像上面的样子？ 当前连接器布局： ? 目前，我在instance.connect方法as described here中定义连接器 connector: {
ty
浏览 218提问于2021-09-08得票数 0
回答已采纳
1回答
使用jsPlumb处理项目时，我将静态连接器设置为两个地图标记。jsplumb连接器的端点出现在地图标记图像的上方，而我希望它们出现在下面。在jsplumb javascript库中，我应该从哪里编辑端点的计算位置？
浏览 2提问于2014-09-12得票数 3
1回答
获取元素的连接信息
、、、、
我正在使用jsPlumb和Javascript来实现一个简单的元素拖放界面，其中可以相互连接。我想知道当点击每个被丢弃的元素上的“设置样”按钮时，如何获得源和目标的连接细节。内部连接器：外连接器： containment: '
浏览 2提问于2016-07-11得票数 1
我正在使用jsPlumb在div之间画线。棘手的部分是，我使用的是bootstrap选项卡窗格，因此在打开页面时可能不会呈现窗格。第二个困难是，一些div是可折叠的，这迫使我重新绘制连接器。重绘操作在Firefox上效果很好，但在任何其他浏览器上，连接器都放错了位置(Chrome实际上是在进行与当前页面偏移量完全相同的偏移量，edge只是在天空中的某个地方重新绘制所有连接器)。我会试着尽快发布一个MWE (我的代码实际上很大，但下面是我所做的)：
<e
浏览 0提问于2016-03-05得票数 1
我是jsPlumb的新手。我通过从数据库中读取表创建了动态div，并使用JsPlumb连接器连接了这些div。divs已设置为可拖动。当页面加载时，连接器可以正确显示，但是当我拖动或移动div时，连接器断开并移动到顶部。如果我创建了一个不是来自数据库的静态div，那么连接器工作得很好，当我拖动/移动div时，连接器也会沿着连接到源和目标div的div移动。在谷歌上进行了完整的搜索并浏览了jsPlumb文档后，我没有找到任何解
浏览 2提问于2013-11-22得票数 2
我使用jsplumb在HTML中创建了一个流程图，将连接器从一个div添加到另一个div。每次创建从一个div到另一个div的连接时，我的jquery代码都会为连接器创建一个svg。为此，我需要找到给定svg连接器(jsplumb连接器)的源和目标。有人能帮我吗。
浏览 2提问于2013-05-24得票数 0
回答已采纳
1回答
我正在使用jsPlumb呈现一些来自react和connecting的元素。每次配置发生变化时，我都要重新连接节点。但我从第二次呈现开始从jsPlumb获得错误，如下所示
.each iteration failed : TypeError: Cannot read property 'force' of undefined然后，所有从jsplumb中拖动/移动的交互都会停止处理错误。通过删除所有端点引用和连接来重置jsPlumb实例的最佳方法是什么？我正在做jsPlumbInstance.r
浏览 3提问于2017-02-21得票数 3
回答已采纳
1回答
我想寻求一些帮助，这是我第一次使用JsPlumb...我想用直连接器更换连接器，我试着阅读那里的文档，但我在理解it.How时遇到了困难。我可以在层次结构图中将连接器改为直线吗？
提前谢谢你。
浏览 1提问于2014-11-29得票数 1
1回答
如何区分JSPlumb中的两个源
、、、、
我正在使用JSPlumb创建一个gui问卷创建者，其中一些回答类型是“是/否”。在调用jsPlumb.getConnections()之后，我试图找出哪个连接器来自yes源，哪个连接器来自no源。
浏览 2提问于2014-02-24得票数 0
回答已采纳
我有一个数组，其中两个SVG元素的id存储在索引0和1中。我正在使用jsplumb在两个元素之间建立一个连接器，我使用的代码如下所示： source: divs[0], })上面的代码不起作用，并给出了以下错误：
jsPlumb.js:6203错误:属性d:期望编号“M00C-10150 NaN”
浏览 2提问于2016-06-07得票数 0
在这一行代码中jsPlumb.connect { }我要通过连接器的样式在这个项目中，我们需要能够在两个元素之间画出连接器。为此，最初的开发人员使用
浏览 4提问于2013-02-20得票数 6
回答已采纳
1回答
我正在尝试实现一个分层树(使用React & JsPlumb)，在节点之间使用循环连接，并将两个节点连接成一个节点。问题是在连接时，层次树的定位不能正常工作。实际上，环路连接与其他节点重叠。我尝试使用Bezier连接器将结束节点连接到分层树中的开始节点，从结束节点的底部锚点连接到开始节点的顶部锚点，而不重叠节点。但是，通过重叠节点，树从结束节点的顶部锚点连接到开始节点的底部锚点。elementsDraggable: false, enableWheelZoom: false
浏览 10提问于2019-04-19得票数 3
回答已采纳
1回答
我试图以下面的方式获取jsPlumb元素的连接信息，该元素已被丢弃在画布上。但是，它提到源和目标it是未定义的。element: "+elemId+"\nConnection in source details: "+ inConId); });
alert("Source ID of connection: "+
浏览 0提问于2016-07-11得票数 0
1回答
几个月以来，我一直在成功地使用。我用直线连接一些div，没有问题。现在我想用垂直线或水平线连接放置在任何地方的任意div。为了实现这个目标，我使用锚点放置线，每次测试每个端点的X，Y的正确值。有没有比jsPlumb更好的替代方案来实现这一点？
浏览 0提问于2013-01-07得票数 0
我已经使用jsplumb匹配了columns模板，其中我使用了拖放功能。一切都在web浏览器上运行得很好。但当我在平板电脑浏览器上运行同样的程序时，它就不能工作了。-- jsplumb util --> <!-- jsplumb drag-->
<
浏览 0提问于2013-02-11得票数 1
我使用的是jsplumb和Primefaces。我有许多p:panel组件作为ui:repeat的一部分生成。然后我想使用jsplumb将这些面板连接在一起。Primefaces生成面板ids，然后我在脚本代码中使用它们来设置jsplumb。
jsPlumb.connect({source:"j_idt
浏览 2提问于2013-01-29得票数 3
回答已采纳
我在JsPlumb连接器路径上遇到问题。火狐、Chrome、IE 10、IE 11的THe连接路径都是直线型的，但在IE 9中却呈“S”型。
浏览 3提问于2014-11-26得票数 0
4回答
有些工作流可能非常复杂，而多个连接器可能会使您很难确定哪个连接器连接到哪个任务。为了修复这个/显示一个指南，我希望在单击连接时隐藏所有连接器，并且只显示单击的连接。我添加连接器的代码如下所示： $(' <div class="window task node Btn Color-Light BR$('#' + id),
taskT
浏览 8提问于2014-06-09得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
