有没有办法根据模型的各个部分将动画分割成三个js？

Question

所以我是 Three.js 的新手，正在尝试开展一个项目，在该项目中我遇到了以下要求 1）加载人形gltf模型 2）播放动画 3）仅停止或播放gltf模型头部的动画，而不更改搅拌机中的动画文件 这可能吗？

在这个问题上寻求帮助，因为动画文件包含 1000 个动画，很难全部修改。所以下一个解决方案是我们是否可以在 Three.js 中控制动画过程中模型的某些部分

Answer 1

您可以使用加载模型时获得的

model.animations

将动画拆分为单独的动画（例如使用

GLTFLoader

、

FBXLoader

等）。

new GLTFLoader().load('foo.gltf', (model) => {
  console.log(model.animations)
})

model.animations

将是

AnimationClip

对象的数组。每个动画剪辑都包含一个tracks列表。根据 GLTF 文件的创建方式，可能有一个包含所有轨道的动画剪辑。

  console.log(model.animations[0].tracks)

您可以随意将这些剪辑分成多个剪辑，这样您就可以独立控制它们。

  const clip1 = model.animations[0] 
  const clip2 = new AnimationClip('clip2', -1, [])

  // move one track from the first clip to the second
  const track = clip1.tracks.pop()
  clip2.tracks.push(track)

现在您有两个剪辑，第一个剪辑 1 包含除现在位于剪辑 2 内的一个轨道之外的所有轨道。

现在您可以像以前一样继续，为每个剪辑制作一个

AnimationAction

。您只需要一个混合器即可执行操作：

  const mixer = new AnimationMixer(model.scene)
  const action1 = mixer.clipAction(clip1) // returns an AnimationAction wrapping clip1.
  const action2 = mixer.clipAction(clip2) // returns an AnimationAction wrapping clip2.

  action1.play()
  // action2.play() // don't play action 2 animation yet, play it later, etc.