26

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

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

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

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

  1. 许多实例- 我希望在我的场景中运行不止一个玩家模型。

    • 我不希望多次加载相同的网格和动画数据。
    • 动画时间应该是每个实例的（所以它们不会同步动画）。

    我应该为同一个模型创建很多THREE.SkinnedMesh吗THREE.Animation？从哪里THREE.AnimationHandler进来？

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

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

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

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

任何信息都将不胜感激，即使只是朝着正确的方向轻推。我不是在完整的教程之后，我想要一些关于这些特性的更高层次的信息。

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

[编辑]
谢谢@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 -将它导出到三个 js/

目前的答案是...

  1. 用了很多THREE.SkinnedMesh还是不确定THREE.AnimationHandler。
  2. 不知道。也许有一种方法可以在THREE.Animation.
  3. 未实施 AFAIK。我可能会尝试创建一个自定义着色器，它可以采用两个THREE.Animations 并在它们之间进行插值。
4

3 回答 3

13

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

请参阅新添加的示例：webgl_animation_skinning_blending.html或在此处查看我自己的几个：

基本角色控制器（具有时间扭曲速度混合）

时间扭曲速度混合

于 2014-02-10T16:37:53.520 回答
0

通过使用带有 JSON 加载器的单独定制功能为每个模型创建单独的蒙皮网格，我能够同时部署使用 Blender 创建的四个不同的动画模型并导出为 JSON 文件。我的四个模型中的每一个都有不同的网格、动画、纹理和关键帧数量。

var loader = new THREE.JSONLoader(); 
loader.load("model_1.js", createSkinnedMeshforModel_1);
loader.load("model_2.js", createSkinnedMeshforModel_2);
loader.load("model_3.js", createSkinnedMeshforModel_3);

...

var animations = [];

function createSkinnedMeshforModel_1( geometry, materials )
{
  var myModel1, animation;
  THREE.AnimationHandler.add( geometry.animation );
  myModel1 = new THREE.SkinnedMesh(geometry, new THREE.MeshFaceMaterial(materials));
  enableSkinning( myModel1 );
  scene.add( myModel1 );
  animation = new THREE.Animation(myModel1, Model1_Animation_title, THREE.AnimationHandler.CATMULLROM);
  animations.push( animation );
  for( var i = 0; i < animations.length; i ++ )
  {
    animations[ i ].play();
  }
}


function createSkinnedMeshforModel_2( geometry, materials )
{
  var myModel2, animation;
  THREE.AnimationHandler.add( geometry.animation );
  myModel2 = new THREE.SkinnedMesh(geometry, new THREE.MeshFaceMaterial(materials));
  enableSkinning( myModel2 );
  scene.add( myModel2 );
  animation = new THREE.Animation(myModel2, Model2_Animation_title, THREE.AnimationHandler.CATMULLROM);
  animations.push( animation );
  for( var i = 0; i < animations.length; i ++ )
  {
    animations[ i ].play();
  }
}

function createSkinnedMeshforModel_3( geometry, materials )
{
  var myModel3, animation;
  THREE.AnimationHandler.add( geometry.animation );
  myModel3 = new THREE.SkinnedMesh(geometry, new THREE.MeshFaceMaterial(materials));
  enableSkinning( myModel3 );
  scene.add( myModel3 );
  animation = new THREE.Animation(myModel3, Model3_Animation_title, THREE.AnimationHandler.CATMULLROM);
  animations.push( animation );
  for( var i = 0; i < animations.length; i ++ )
  {
    animations[ i ].play();
  }
}

enableSkinning() 函数与DEVMATRIX 真正有用的教程中提供的函数相同

“Modelx_Animation_title”变量是 Blender 中定义的动画标题名称，并由 Three.js Blender 导出器复制到模型导出的 JSON 文件中。

当我加载给定模型的多个副本时，它们最初在同步中进行动画处理。但是，我已经能够通过在再次开始播放之前将每个模型单独暂停一小段随机持续时间来让它们动画不同步。每个单独模型的动画从它们暂停的帧恢复。

animations[ i ].pause();
... (random delay) ...
animations[ i ].play();

也许这种方法为问题 1 提供了某种解决方案，也可能为问题 2 提供了解决方案。

关于问题 2，Three.js 版本 r62 更新了 Blender 导出器以允许“导出多个操作”。虽然我没有尝试过，但也许这可能允许加载给定模型的两个或多个副本，同时为不同的动作指定动画标题。然后，当需要不同的操作时，可以将模型交换进和交换出视图。

如果可行，那么问题 3 的一个可能解决方案可能是在 Blender 中创建一个额外的动画动作，将模型从活动状态混合到空闲状态。

于 2014-01-25T13:12:04.713 回答
0

@Xealgo：Maya 有一个新的导出器，它也可以制作骨骼和动画。在我被迫使用 Blender 工作流程之前，我很想在几个月前拥有它。:)

这是一个链接：https ://github.com/mrdoob/three.js/tree/dev/utils/exporters/maya

于 2014-04-21T13:55:12.277 回答