javascript - Three.js - 蒙皮骨架网格实例、动画和混合

Question

我正在开发一款小型多人游戏，它有一个单皮肤玩家网格，许多玩家都在使用它。一些背景:我尝试通过 maya 和 blender collada 导出加载。两者似乎都引用了某种形式的动画数据，但我无法让它工作。我试过 Maya JSON 导出器，它只用一条 Material 线吐出微小的 1k 文件。最后， blender JSON 导出器工作了。对于那些也尝试加载蒙皮网格的人，我发现这非常有用:Model with bones animation (blender export) animating incorrectly in three.js

所以现在我有一个 geometry对象和 materials来自 JSON 加载器的数组。

我可以设置skinning=true在 Material 上，创建一个THREE.SkinnedMesh ，添加到场景中，通过THREE.AnimationHandler.add添加动画( 我不太清楚 AnimationHandler 实际上做了什么 )，创建一个 THREE.Animation , 调用play()和 update(dt) .最后，我的场景中播放了一个网格和一个动画。

现在我想要的是这些...

许多实例 - 我想要在我的场景中跑来跑去的不止一个玩家模型。

我不希望多次加载相同的网格和动画数据。

动画时间应该是每个实例的(所以它们不会同步动画)。

我应该创建很多 THREE.SkinnedMesh和 THREE.Animation对于同一个型号？ THREE.AnimationHandler 在哪里进来？

许多动画 - 我希望能够单独播放空闲/运行周期。

AFAIK 只有一个动画关键帧时间线。 Three.js 如何为我进行分区，还是我必须手动进行？

动画混合 - 当一个 Angular 色停止奔跑并静止不动并带有空闲动画时，我不想要从一个到另一个的瞬间捕捉。我想暂停运行动画并将该状态混合回空闲动画。

目前这对于蒙皮网格(不是变形目标)是否可行？是否有关于此的示例或文档？

任何信息都将不胜感激，即使只是朝着正确的方向轻推。我不是在完成完整的教程，我想要一些有关这些功能的更高级别的信息。

我可以愉快地实现 2 和 3，但我想要一些关于threejs 皮肤和动画框架的信息/描述性文档来帮助我入门。例如， this没什么可继续的。

[编辑]
谢谢@NishchitDhanani，这个页面非常好，但没有提到多个动画或混合骨骼动画: http://chimera.labs.oreilly.com/books/1234000000802/ch05.html#animating_characters_with_skinning

该页面说多个动画仍然是当前问题，但仅此而已(在评论中进行了一些讨论):
http://devmatrix.wordpress.com/2013/02/27/creating-skeletal-animation-in-blender-and-exporting-it-to-three-js/

目前的答案是...

多用THREE.SkinnedMesh仍然不确定THREE.AnimationHandler .

不知道。也许有一种方法可以在 THREE.Animation 中手动修改开始/结束关键帧。 .

未实现 AFAIK。我可能会尝试创建一个自定义着色器，它可以占用两个 THREE.Animation s 并在它们之间进行插值。

Answer 1

从 67 版(2014 年 4 月)开始，支持骨骼动画混合和多个动画。您仍然需要创建一个 SkinnedMesh对于每个模型。 AnimationHandler负责更新(勾选)每一帧的动画，所以你应该调用 update 而不是在每个 Animation 上手动调用.

请参阅新添加的示例: webgl_animation_skinning_blending.html 或者在这里查看我自己的几个:

Basic Character Controller (with time warped speed blend)

Time Warped Speed Blend