AFrame模型动画在a-animation上改变轨迹

Question

我正在加载模型并尝试更改 a-animation 事件的动画轨道：

<a-entity three-model="loader:object;src:url(http://localhost:3000/upload/6tTxHz6JMPXMsGD8W/marine_anims_core.json);animation:run;animationDuration:0;enableAnimation:true" >
   <a-animation begin="mouseenter" attribute="three-model.animation" repeat="1" dur="1000" direction="alternate" from="walk" to="run"></a-animation>
</a-entity>

很遗憾，我似乎遇到了这样的错误：

aframe-extras.loaders.min.js:688 [three-model] Animation "NaN" not found.
   playAnimation @ aframe-extras.loaders.min.js:688
   update @ aframe-extras.loaders.min.js:658
   updateProperties @ component.js:205
   value @ a-entity.js:427
   value @ a-entity.js:450
   value @ a-entity.js:579
   f @ a-animation.js:426
   (anonymous function) @ a-animation.js:136
   update @ Tween.js:339
   update @ Tween.js:81
   value @ a-scene.js:382
   value @ a-scene.js:407

我不确定这是因为 A-Animation 没有处理文本还是什么？

Answer 1

<-animation> 依赖于 Tween.js（参见 https://github.com/tweenjs/tween.js/ 文档），它基本上采用 from 值和 to 值，在引擎盖，数字（即使是颜色也是如此）。 from 值将相当于时间 0 的 0 和时间 dur 的值 1。从 0 到 1 的变化将取决于选择的 easing 但基本上你会被分配给你选择的 attribute to-from*0 to-from*0.1 to-from*.0.2 ... to-从*0.9 到-从*1.

综上所述，补间依赖于连续值，而不是离散值。 walk 和运行之间的中间值是什么？运行-步行*.0.2？走快一点？运行-慢？如果你的补间系统不能插入从 from 到 to 的值，那么你的动画（至少在当前 0.3 中使用的补间系统）将无法工作。

您可以做的是在您的模型上添加一个 addEventListener()，启动运行动画（如果尚未运行ning），等待所需的时间，停止它并开始行走再次动画。

Answer 2

我会使用事件集组件来更改值以响应事件：https://github.com/ngokevin/kframe/tree/master/components/event-set

<a-entity three-model="animation: walk" event-set="_event: mouseenter; three-model.animation: run;>

AFrame模型动画在a-animation上改变轨迹

AFrame model animation change track on a-animation

aframe