Echarts 的取消动画效果,animation、layoutAnimation:false,

在Echarts中,针对关系图的初始化动画无法通过常规的`animation:false`属性关闭。经过调查发现,力引导布局的动画是由`layoutAnimation:false`控制的。在节点数量较多的情况下,关闭该动画可能导致浏览器性能下降。本文探讨了如何在Echarts4中特别是对于关系图类型,禁用力引导布局的动画效果。
摘要由CSDN通过智能技术生成

做公司项目需要实现一个关系图,却发现初始化动画一直无法取消,图示:在这里插入图片描述
在echarts 中相关案例中,都有差不多的效果,但在初始化时,都会有一个初始化动画(非Loading动画),可参考实例:

https://www.makeapie.com/editor.html?c=x5rYx4aXK

在这里插入图片描述
在echarts5 的相关实例中尝试 加上 animation:false 属性,即可停止初始化动画,在echarts4中 除关系图外,别的图示加上 animation:false 属性,也可以停止动画, 但关系图却不可以,后续查证得到 layoutAnimation:false 方法,

在这里插入图片描述

力引导图基本配置
在这里插入图片描述

因为力引导布局会在多次迭代后才会稳定,这个参数决定是否显示布局的迭代动画,在浏览器端节点数据较多(>100)的时候不建议关闭,布局过程会造成浏览器假死。

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值