G6
G6 copied to clipboard
力导向图如何配置线不重合
问题描述
在力导向图jie节点较少的情况下,同一个主节点的线会重合,比如图上id=1和id=2的节点都是属于id=0的主节点,但是视觉上并不能直观的确定id=2的节点的主节点是id=1还是id=0,请问如何避免这种情况的发生,或者能不能像echarts一样布局时施加一个转动的力让这种会显示在一条线上的节点尽量分开
重现链接
https://codesandbox.io/s/g607fp?file=/index.js
重现步骤
进入页面,查看展示效果
预期行为
我期望看到不同的边不会重合
平台
- 操作系统: [macOS, Windows, Linux, React Native ...]
- 网页浏览器: [Google Chrome, Safari, Firefox]
- G6 版本: [4.5.1 ... ]
屏幕截图或视频(可选)
No response
补充说明(可选)
No response
感谢建议。出现这个的原因是在进行了 force 布局之前,会初始化为 grid 布局。而节点比较少的时候,这些节点恰好在 grid 布局中的一行,所以没能达到一个分开的效果。我们后面会为布局增加 preset 预布局,可以自由配置。目前,可以通过在数据中初始化 random 的 x y 来达到你想要的效果,比如在读取数据之前:
data.nodes.forEach(node => { node.x = Math.random(); node.y = Math.random() })
您好,我也遇到同样问题,想请教一下 您最后是怎么解决的
布局已支持配置 preset,你可以在 layout 中配置 preset: { type: 'random' } 或 circular 等其他布局类型