新建一个g6实例之后(在一开始新建实例的配置里并没有layout配置项),点击按钮,根据具体业务通过graph.updateLayout切换布局,监听到的afterlayout事件为什么总是两次 #4637
brick-204 posted onGitHub
问题描述
1、新建一个g6实例之后(在一开始新建实例的配置里并没有layout配置项),点击按钮,根据具体业务通过graph.updateLayout切换布局,监听到的afterlayout事件为什么总是两次
const [a, setA] = useState(true);
const graph = new G6.Graph({container,width,height});
graph.on('afterlayout', evt => {
console.log(‘finish layout’);
});
useEffect(()=>{
if (a) {
graph.updateLayout({type:'force2'});
} else {
graph.updateLayout({type:'comboCombined'});
}
graph.read(newData); // 新数据获取,并且重新渲染
},[a])
return <div><button onclick={()=>{setA(false)}}>click me</button> </div>
想过通过graph.set('layout',{type:'force2'})去改变布局配置,并重新布局渲染,没有生效,不知道是什么问题,望解答
2、对于comboCombined布局,想问当只有nodes没有combos时,是通过什么布局方法进行布局的(内部布局还是外部,目前来看貌似是外部布局,但布局效果重叠较多和渲染性能也较低);还有在大数据情况(只有两千多个nodes)下布局渲染性能似乎比同等数量两千多个nodes以及还有一千多个combos还低大概一半(即假设前者用时40s,后者则只用时20s),comboCombined是否是不适用于只有结点的情况。(node一致大小,内置的circle;combo自动撑起;线为‘line’,部分‘loop’)
3、好像无法将antd的Spin组件运用在图上,比如有个需求在切换布局配置然后重新渲染布局的过程中无法显示遮罩层以及加载中的旋转图标。具体setLoading(true)写在监听事件‘beforeRender’上,setLoading(false)写在监听事件‘afterRender’上,但貌似跟预期不一样,没有生效,想知道具体要怎么配合使用,在g6图的布局渲染过程之中运用Spin组件图层。
重现链接
写了些片段代码在上面
重现步骤
1、对于第一个问题,点击按钮改变a的state值,通过副作用监听切换对应布局,并且拿到新数据进行渲染。 2、在这个过程后,就会出现打印两次finish layout的情况
预期行为
一些疑问能得到解答
平台
- 操作系统: [ Windows , React Native ...]
- 网页浏览器: [Google Chrome]
- G6 版本: [4.7.1 ... ]
屏幕截图或视频(可选)
No response
补充说明(可选)
No response