jsPlumb流程图5x中连接器布局方向的更改

Question

我使用的是jsPlumb 5x的流程图应用程序。使用的包是@jsplumb/connector-流程图和@jsplumb/browser-ui。我决定使用流程图连接器。我找不到更改连接器布局的方法。

​

​

有没有办法改变样式，使新的布局看起来像上面的样子？

当前连接器布局：

​

​

目前，我在instance.connect方法as described here中定义连接器

connector: {
          type: FlowchartConnector.type,
          options: {
            stub: [10, 20],
            gap: 1,
            cornerRadius: 2,
            alwaysRespectStubs: true
          }
        },

该布局使用以下代码在jsPlumb 2x上按预期工作：

connector: ["Flowchart", {
          stub: [10, 20],
          gap: 1,
          cornerRadius: 2,
          alwaysRespectStubs: true
        }], 

有没有办法在5x上改变流程图连接器的布局？

Answer 1

我认为这里的问题可能是你正在使用的锚点-它看起来不像你的边缘从Bottom边缘到Top边缘。

你可以在这个页面上阅读有关锚的内容：https://docs.jsplumbtoolkit.com/community/lib/anchors

要指定Top和Bottom，您可以在默认值中提供这些值：

https://docs.jsplumbtoolkit.com/community/lib/defaults

或者在connect调用中。

在从2.x到5.x的迁移中，您可能在某个地方设置了Anchor或Anchors默认值，但请注意，5.x中的所有默认值现在都是小写的：anchor / anchors等。