A-frame 播放来自 sketchfab 的特定动画答案

【问题标题】：A-frame play specific animations from sketch fabA-frame 播放来自 sketchfab 的特定动画
【发布时间】：2021-09-09 06:02:51
【问题描述】：

我正在使用 A 帧 (https://aframe.io) 创建场景。

我正在尝试将 gltf 的乌鸦模型放入来自 sketchfab 的场景中。

但是，sketchfab 中的乌鸦模型有两种不同的动画 - 有一个移动姿势和一个静态姿势。由于gltf 在模型中内置了两个不同的动画，所以当我将它放入我的场景时，模型没有动画，因为它处于默认静态姿势。

如何让乌鸦gltf 模型进入我的动画场景，以便播放TakeOff 动画？

为了澄清起见，我正在寻找一种方法来专门引用 gltf 模型上的 TakeOff 动画，以便模型不动画它应该动画 TakeOff 动画。乌鸦gltf型号的链接：https://sketchfab.com/3d-models/crow-d5a9b0df4da3493688b63ce42c8a83e2

将gltf 模型放入我的场景的代码：

<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
<a-scene>
  <a-entity gltf-model="https://cdn.glitch.com/a9b3accf-725d-4891-aa13-0786dd661cab%2Fscene%20-%202021-07-01T193347.857.glb?v=1625193238260" position="20 0 -35" rotation="0 90 0" scale="1 1 1" animation-mixer="clip:Take 001; loop:10000000000000000000; timeScale: 1; crossFadeDuration: 1"></a-entity>
</a-scene>

【问题讨论】：

标签： javascript jquery three.js aframe webvr

【解决方案1】：

为了使用animation-mixer，您应该包含aframe-extras，它是其中的一部分。您可以使用他们的 cdn，如下面的代码所示。

您要查找的剪辑称为root|takeOff，您将在代码中看到。

（此外，您发布的代码具有不同的 glTF 的 wardrode 而不是您正在寻找的乌鸦；因此您应该将 {{YOUR MODEL}} 替换为乌鸦。）

<script src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/donmccurdy/aframe-extras@v6.1.1/dist/aframe-extras.min.js"></script>
<a-scene>
  <a-entity gltf-model="{{YOUR MODEL}}" position="20 0 -35" rotation="0 90 0" scale="1 1 1" animation-mixer="clip:root|TakeOff; loop:10000000000000000000; timeScale: 1; crossFadeDuration: 1"></a-entity>
</a-scene>

您可以使用的其他动画是root|LookAround 和root|Eat。

【讨论】：