Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

能不能从edge某一位置拖出一条新的edge,又或者对边连接边支持友好一些 #3430

Open
oyal opened this issue Mar 25, 2023 · 10 comments
Labels
type: feature 新功能 Feature/enhancement requests

Comments

@oyal
Copy link

oyal commented Mar 25, 2023

问题描述

目前 x6 的 edge 视图是这样的,是一个矩形框,如果是折线的话包括了很多不需要的区域

image

我需要的是下图这种,只有绿色区域是 edge 视图

image

目前这个原因会导致一些问题,比如对边连接边支持不够友好,比如我开启 allowEdge 和自动吸附,鼠标在红色
区域才能识别到高亮。还有我通过 findEdgeViewsInArea 获取到的视图也是存在问题

image

这是一个mxGraph的官方示例,应该也有一些人需要这些的功能

  • 拖出的 edge 可以连接在另一条边的任何位置
  • 可以从 edge 的中间拖出一条线

20230325_110054

重现链接

https://jgraph.github.io/mxgraph/javascript/examples/wires.html

重现步骤

image

预期行为

20230325_110054

平台

  • 操作系统: [Windows]
  • 网页浏览器: [Google Chrome]
  • X6 版本: [2.5.7]

屏幕截图或视频(可选)

No response

补充说明(可选)

No response

@lloydzhou
Copy link
Contributor

#2027 可以看看这个issue

@oyal
Copy link
Author

oyal commented Mar 27, 2023

#2027 可以看看这个issue

感谢回复,这个 issue 我也关注了,通过锚点也达不到上述示例的效果。

比如我从链接桩拖出一条边,即将连接到另一条边会有高亮和吸附功能,松开鼠标就连接到了相应的位置。目前在 x6 中没有好的实现方法

从边中拖出一条边也没什么思路可以实现

@NewByVector
Copy link
Contributor

@oyal 是否可以监听边的点击事件,点击后新建一条边,source 指向之前的边,target 设置为 point,随着鼠标移动而移动。

@NewByVector NewByVector added the type: discussion 讨论 Usage questions, guidance, and other discussions label Mar 29, 2023
@oyal
Copy link
Author

oyal commented Mar 29, 2023

@oyal 是否可以监听边的点击事件,点击后新建一条边,source 指向之前的边,target 设置为 point,随着鼠标移动而移动。

感谢回复,您说的这种方案之前有人提过类似需求,但我并没有好的实现思路 #2010 (comment)

另外我也研究了下边的高亮问题,是开启 snap 后导致的,不知为何会冲突。提了一个新的 issue。#3439

image

image

@NewByVector
Copy link
Contributor

从边创建边确实是我们现在比较缺少的一个功能,已经加入我们的工作计划了,感谢你指出问题。

@NewByVector NewByVector added type: feature 新功能 Feature/enhancement requests and removed type: discussion 讨论 Usage questions, guidance, and other discussions labels Apr 1, 2023
@Aperture-Electronic
Copy link

我有一种临时的解决思路,就是在从节点A连线点击到边B上时,记录下当前点击的位置,然后在该位置创建一个新的节点(样式可以是黑色圆形)。然后,记录下边B的起点(B.start)和终点(B.end),将原来的边删除,再创建三条新边,分别是[B.start]-[新节点],[B.end]-[新节点]和[A]-新节点,这样看起来它们的连接就类似电路图上的分叉了

@oyal
Copy link
Author

oyal commented Apr 6, 2023

我有一种临时的解决思路,就是在从节点A连线点击到边B上时,记录下当前点击的位置,然后在该位置创建一个新的节点(样式可以是黑色圆形)。然后,记录下边B的起点(B.start)和终点(B.end),将原来的边删除,再创建三条新边,分别是[B.start]-[新节点],[B.end]-[新节点]和[A]-新节点,这样看起来它们的连接就类似电路图上的分叉了

我们的思路一样,但是也有很多问题,一个是现在的边的高亮吸附还是有点问题,只能吸附到边的中间,可以看我另一个issue #3439 (comment)
还有就是自动生成节点的位置,edge:connected中没有画布xy,只能在edge:mouseup(鼠标松开)事件中拿到画布xy,由于是吸附过去的,这个xy是鼠标松开的坐标,所以会有偏差,造成效果新增的三条边不够理想

image
image

@Tabris7777
Copy link

同碰到这个问题,目前还在探索效果能让客户接收的方案,做工艺图仿真类的需求会有大量边连接边的情况,类似下面这种
wKh2CVze5p6Ad7knAADvLlmYo48711

@nanfb
Copy link

nanfb commented Nov 2, 2023

同碰到这个问题,目前还在探索效果能让客户接收的方案,做工艺图仿真类的需求会有大量边连接边的情况,类似下面这种 wKh2CVze5p6Ad7knAADvLlmYo48711

最后用的什么方案,有类似的需求

@maqingbo
Copy link

从边创建边确实是我们现在比较缺少的一个功能,已经加入我们的工作计划了,感谢你指出问题。

@NewByVector 大哥,关于边的计划有动静了吗?好久没更新了😅

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: feature 新功能 Feature/enhancement requests
Projects
None yet
Development

No branches or pull requests

7 participants