乐趣区

关于html5:Sovit3D可视化开发平台-零代码实现组件动画特效

“动画”特效在 3D 可视化开发中算的上是必不可少的元素之一,它能够直观活泼的还原实在场景。

近日,3D 可视化开发工具——Sovit3D 就又更新了“在线动画定义性能”,零代码实现三维场景中的模型组件动画。

比方 咱们在开发智慧风电场我的项目时,能够用数字孪生技术对风机进行数字映射建模,而后通过传感器获取风机的各项数据,绑定数据驱动风机旋转动画,1:1 还原风机实在发电场景。

▲ 旋转、变色、显影等动画成果

目前反对的动画特效类型

旋转动画:设置三维组件实现旋转,设置 360 度旋转或只转动一个小角度。

变色显示:设置绑定某个数据触发变色,能够依据不同的条件变成不同的色彩。

心跳动画:设置三维组件实现循环跳动的成果。

显隐闪动:绑定数据达到指定条件后实现“显示暗藏”一直闪动成果。

变色闪动:绑定数据达到指定条件后实现“色彩变动”一直闪动成果。

所有动画都可绑定动态数据,通过数据变动触发动画成果

上面以风机为例进行动画设置

选中要设置动画的组件,上图选中的是“叶片与轮毂整体”组。(在风机建模的时候曾经分好了组,三个叶片 + 轮毂同属一个组。同时这个组又和“机舱整体”组一起组合为“叶片与机舱整体”组)。

# 进入【动画】设置页签。

·【动画类型】中抉择“旋转”动画。

·【旋转轴】抉择“Z 轴”(场景中蓝色轴为 Z 轴)。

·【执行类型】抉择“有限循环”(当抉择有限循环时旋转角度只能是 360 度)、“执行工夫”(数字“6”代表转一圈须要的工夫为 6 秒)。

注:设置动画时能够抉择数据集绑定动态数据,并且设置数据触发条件,不同的数据条件旋转的速度也不一样。

# 接下来用同样的办法对“叶片与机舱整体”组设置转动某个角度的动画,实现机舱“偏航”的成果。

同时绑定一个动态数据实现两个角度变动的成果, 设置完保留即可。

动画设置完后,通过预览或公布后能够查看动画成果

以下为风机动画效果图演示


更多动画成果将会陆续更新公布,关注数维图微信公众号或进入官网(www.SovitJs.com),获取产品最新动静。

退出移动版