X6
X6 copied to clipboard
X6是否存在和G6类似的通过点击链接桩创建边的功能
功能描述
当图元过多,节点间距离太大时连线不好操作
期望解决方案
1.鼠标点击(click)源节点链接桩后,在链接桩与鼠标之间生成一条边; 2.边需要跟随鼠标移动; 3.点击画布空白地方,连线失败; 4.点击目标节点的链接桩,校验是否连线合法,合法则完成连接
这个是默认就有的功能,现在是遇到了什么问题呢?
这个是默认就有的功能,现在是遇到了什么问题呢?
官方提供的案例都是通过拖拽生成边,未发现有点击源链接桩生成边的例子或相应文档,我应该如何对它进行配置才能达到点击链接桩生成边的目的呢?
这里说的G6的交互,应该是G6那边一个内置的创建边的交互模式 https://antv-g6.gitee.io/zh/docs/manual/middle/states/defaultBehavior#create-edge
两个库,由于设计理念,使用场景不太一样。所以默认的交互逻辑有一些区别。
- G6这个内置的创建边的逻辑,也可以通过将
trigger
配置为drag
变成和X6这边一样的连线逻辑。 - X6这边,你也可以自己通过监听几个事件组合实现点击后连线的逻辑。
大概需要监听
node:magnet:click
,blank:mousemove
就可以实现了吧。
这里说的G6的交互,应该是G6那边一个内置的创建边的交互模式 https://antv-g6.gitee.io/zh/docs/manual/middle/states/defaultBehavior#create-edge
两个库,由于设计理念,使用场景不太一样。所以默认的交互逻辑有一些区别。
- G6这个内置的创建边的逻辑,也可以通过将
trigger
配置为drag
变成和X6这边一样的连线逻辑。- X6这边,你也可以自己通过监听几个事件组合实现点击后连线的逻辑。
大概需要监听
node:magnet:click
,blank:mousemove
就可以实现了吧。
是的,我们的思路是一致的,我之前已经实现这个功能,而且深入到节点的链接桩,不过由于逻辑方面的问题导致性能损耗很大,效果不理想,同时和原有通过拖动生成边的功能部分重叠,因此想在官方方面层面看是否有更完善的功能。
逻辑很简单,判断点击事件
有一个cache数组,[第一位,第二位] 第一次点击,如果是portid,port加入cache数组第一位。
在第二次点击后 1 判断cache数组是否有且只有1个元素。 2 如果有,该次点击的portid如果不在 第一个元素所在的节点上,就创建成功 3 如果不是,清空cache数组。
是否能创建 在createEdge函数 里搞
完毕
x6主要问题是性能不好,导出有bug,用的话还是凑合的。
这样可以实现两点间边的创建 但是如何实现鼠标移动过程中边也跟随移动 就像拖拽时那样
This thread has been automatically locked because it has not had recent activity.
Please open a new issue for related bugs and link to relevant comments in this thread.