首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

使用动画曲线编辑器打造炫酷的3D可视化ACE

在制作3D可视化看板时,除了精细的模型结构外,炫酷的动画效果也是必不可少的。无论是复杂的还是简单的动画效果,要实现100%的自然平滑都是具有挑战性的工作。这涉及到物理引擎的计算和对动画效果的数学建模分析。一般来说,只有专业的3D建模从业人员才能完成这项挑战。然而,在实际情况下,当我们对动画精细程度的要求不是特别高时,仍然可以借助一些外部工具来实现一些常见的动画效果,例如巡检、移动和旋转等。今天小编向大家介绍的工具就是Babylon.js中提供的动画曲线编辑器。用户只需要通过简单的拖拽和点击操作,就能自定义设计想要的动画效果,提升3D可视化看板的视觉效果。(如下图所示)

01

特效组件流程分析

transition和animation的选择: 【1】两者的第一点区别,触发条件不同,transition通常和hover等事件配合使用,由事件触发,不立即执行。animation则和gif动态图差不多,立即播放。 animation不能用事件触发。(解决方法:通过点击以后添加类名,执行动画。比如动画时长1s,在点击函数中加动画类名,然后设置倒计时1s,1s动画执行完后再去除这个动画类名即可) 【2】两者第二点区别,transition无法重复执行动效。而animation可以设定循环次数。 【3】两者的第三点区别,animation与js的交互不是很紧密。 两者真正的区别是,animation写死了各个属性的变化值,使其不容易被js改写,但是可以在不同的动画类名之间选择(比如设置fade动画,需要对fade效果做改变,不太好进行。切换/skew); 而transition的属性值则是可以发生改变。 【4】两者各自的优势 其实两者的区别都可以用一些方式去弥补,只是哪个更便利。

02
领券