Question

我已经建立了从A点到B到C的脚本动画，依此类推。

通过JS触发动画（例如document.getElementById（'camera'）。emit（'animazione_zero_avanti'））。

我正在创建这样的动画：

我想在第一个动画中添加Z轴旋转。动画可以有多个属性吗？

提前致谢。

Answer 1

您可以添加多个元素。虽然请注意，由于生病，不建议在VR上旋转相机或控制它。由于控件不断更新相机，您可能会遇到麻烦。您可能能够为包装器实体设置动画，但旋转将构成奇怪的结构。

<a-camera>
  <a-animation attribute="position" ...></a-animation>
  <a-animation attribute="rotation" ...></a-animation>
</a-camera>

或者

<a-entity>
  <a-animation attribute="rotation" ...></a-animation>
  <a-camera>
    <a-animation attribute="position" ...></a-animation>
  </a-camera> 
</a-entity>

Answer 2

不再支持aframe版本0.9.0 <a-animation>。

但是您仍然可以使用属性animation使用和组合动画。

例如：

<a-sphere color="blue" radius="0.5" position="0 0.5 0" segments-height="53"
    animation='   property: position; dur: 5000; from: -2 0.5 0; to: 2 0.5 0; dir: alternate; easing: linear; loop: true;'
    animation__2='property: rotation; dur: 1000; from: 0 0 0;    to: 0 360 0; dir: normal;    easing: linear; loop: true;'
    animation__3='property:    scale; dur: 1000; from: 1 1 1;    to: 2 2 2;   dir: alternate; easing: linear; loop: true;'>
</a-sphere>

可以在此CodePen上找到一个实时示例。

在a-frame API处有更多详细信息。

多个aframe动画

2 个答案: