LogicFlow icon indicating copy to clipboard operation
LogicFlow copied to clipboard

[Feature Request]设置节点锚点id,节点可通过锚点id自动连线

Open GM-117 opened this issue 2 years ago • 8 comments

问题背景

通过 getDefaultAnchor 设置锚点,能否在数据 edges 中设置 sourceAnchorId 与 targetAnchorId 自动连接对应节点的锚点。 设置 TA0001 节点右锚点 与 TA0002 节点左锚点自动连线

目前查询文档未看到有此功能。 感谢🙇‍

提案

相关信息

image image

GM-117 avatar Jul 24 '23 03:07 GM-117

什么场景需要这么做呢?在已知节点锚点之间的连接关系的情况下可以自己手动调用addEdge完成边的生成

wumail avatar Jul 24 '23 06:07 wumail

在绘制层次图中,通过数据的配置,指定 edges 中的 sourceAnchorId 与 targetAnchorId 能够将两个节点 node 对应锚点连接起来。

例如: 指定 TEST01 下边锚点 与 TEST02 & TEST03 左边锚点通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现。 image

感谢🙇‍

GM-117 avatar Jul 24 '23 07:07 GM-117

在绘制层次图中,通过数据的配置,指定 edges 中的 sourceAnchorId 与 targetAnchorId 能够将两个节点 node 对应锚点连接起来。

例如: 指定 TEST01 下边锚点 与 TEST02 & TEST03 左边锚点通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现。 image

感谢🙇‍

「通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现」没太看懂,如果通过addEdge绘制有哪里不符合预期吗 👀https://docs.logic-flow.cn/docs/#/zh/api/logicFlowApi?id=addedge 自己算出起始点下锚点和终点左锚点

wumail avatar Jul 24 '23 07:07 wumail

在绘制层次图中,通过数据的配置,指定 edges 中的 sourceAnchorId 与 targetAnchorId 能够将两个节点 node 对应锚点连接起来。 例如: 指定 TEST01 下边锚点 与 TEST02 & TEST03 左边锚点通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现。 image 感谢🙇‍

「通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现」没太看懂,如果通过addEdge绘制有哪里不符合预期吗 👀https://docs.logic-flow.cn/docs/#/zh/api/logicFlowApi?id=addedge 自己算出起始点下锚点和终点左锚点

后续可以支持,可以先尝试这样做

wumail avatar Jul 24 '23 07:07 wumail

在绘制层次图中,通过数据的配置,指定 edges 中的 sourceAnchorId 与 targetAnchorId 能够将两个节点 node 对应锚点连接起来。 例如: 指定 TEST01 下边锚点 与 TEST02 & TEST03 左边锚点通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现。 image 感谢🙇‍

「通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现」没太看懂,如果通过addEdge绘制有哪里不符合预期吗 👀https://docs.logic-flow.cn/docs/#/zh/api/logicFlowApi?id=addedge 自己算出起始点下锚点和终点左锚点

不符合预期 image

GM-117 avatar Jul 24 '23 08:07 GM-117

例如:https://antv-g6.gitee.io/zh/docs/manual/middle/elements/nodes/anchorpoint/#gatsby-focus-wrapper image

如这种实现,可以在edges中设置节点锚点的值,连线将根据节点锚点进行相连,并且直角绘制不会出现曲折

image

在logicFlow中查阅文档,可以为每个节点上下左右锚点设置对应的id,能否通过 sourceAnchorId 与 targetAnchorId 将两个节点 node 对应锚点连接起来,而不是计算节点锚点的位置,通过锚点id就可以连接~

感谢🙇‍

GM-117 avatar Jul 24 '23 08:07 GM-117

在绘制层次图中,通过数据的配置,指定 edges 中的 sourceAnchorId 与 targetAnchorId 能够将两个节点 node 对应锚点连接起来。 例如: 指定 TEST01 下边锚点 与 TEST02 & TEST03 左边锚点通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现。 image 感谢🙇‍

「通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现」没太看懂,如果通过addEdge绘制有哪里不符合预期吗 👀https://docs.logic-flow.cn/docs/#/zh/api/logicFlowApi?id=addedge 自己算出起始点下锚点和终点左锚点

不符合预期 image

这里pointsList计算规则最近会改一版,我测试了改版后的应该是符合你预期的。至于通过锚点ID连线的这个问题,后续可以支持

wumail avatar Jul 24 '23 08:07 wumail

在绘制层次图中,通过数据的配置,指定 edges 中的 sourceAnchorId 与 targetAnchorId 能够将两个节点 node 对应锚点连接起来。 例如: 指定 TEST01 下边锚点 与 TEST02 & TEST03 左边锚点通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现。 image 感谢🙇‍

「通过 edges 中配置的 sourceAnchorId 与 targetAnchorId 绘制直角连线 而不是通过 pointsList 绘制直角位置坐标来实现」没太看懂,如果通过addEdge绘制有哪里不符合预期吗 👀https://docs.logic-flow.cn/docs/#/zh/api/logicFlowApi?id=addedge 自己算出起始点下锚点和终点左锚点

不符合预期 image

这里pointsList计算规则最近会改一版,我测试了改版后的应该是符合你预期的。至于通过锚点ID连线的这个问题,后续可以支持

感谢🙇‍

GM-117 avatar Jul 24 '23 08:07 GM-117

例如:https://antv-g6.gitee.io/zh/docs/manual/middle/elements/nodes/anchorpoint/#gatsby-focus-wrapper image

如这种实现,可以在edges中设置节点锚点的值,连线将根据节点锚点进行相连,并且直角绘制不会出现曲折

image

在logicFlow中查阅文档,可以为每个节点上下左右锚点设置对应的id,能否通过 sourceAnchorId 与 targetAnchorId 将两个节点 node 对应锚点连接起来,而不是计算节点锚点的位置,通过锚点id就可以连接~

感谢🙇‍

该功能已于1.2.23版本支持上了,请试下呢~

DymoneLewis avatar Mar 21 '24 06:03 DymoneLewis