除非修改源代码，否则 Three.js 骨骼动画无法工作

使用 Three.js r68+，我需要对源代码进行轻微修改才能使我的动画正常工作。未经修改，每种类型的模型中只有一个是动画的（每种类型的模型都有多个生成）。

这是第 29407 行的修改后的源代码（从 29389 开始发布的代码）：

THREE.AnimationHandler = {

LINEAR: 0,
CATMULLROM: 1,
CATMULLROM_FORWARD: 2,

//

add: function () { console.warn( 'THREE.AnimationHandler.add() has been deprecated.' ); },
get: function () { console.warn( 'THREE.AnimationHandler.get() has been deprecated.' ); },
remove: function () { console.warn( 'THREE.AnimationHandler.remove() has been deprecated.' ); },

//

animations: [],

init: function ( data ) {

    // original -> if ( data.initialized === true ) return;
    if ( data.initialized === true ) return data; //<-- modified

该函数现在返回动画数据（如果已初始化）。我假设它不会因为缓存而这样做。我的问题是对具有相同动画名称的多个模型进行动画处理的最佳实践是什么？我尝试根据模型名称对它们进行唯一命名，即：“Death_MaleWarrior”，但这没有效果。

目前我的模型和动画的处理方式如下：

var modelArray = [];
var geoCache   = [];
var loader     = new THREE.JSONLoader(true);

var _MODEL = function(data){

  this.data       = data;  
  this.mesh       = null;
  this.animations = {};
  this.canAnimate = false;

  this.parseAnimations = function () {

    var len,i,anim;

    if (this.mesh) {

          if( this.mesh.geometry.animations ){
              this.canAnimate = true;
              len = this.mesh.geometry.animations.length;
              if( len ){
                  for(i=0;i<len;i++){
                      anim = this.mesh.geometry.animations[i];
                      if( anim ){
                        this.animations[anim.name] = new THREE.Animation( this.mesh, anim );
                      }
                  }
              }
          }
      }
  };

  this.playAnimation = function(label){

    if (this.canAnimate) {
      if( this.animations[label] ){
        //if( this.animations[label].data ){
          this.animations[label].play(0,1);
        //}
      }
    }
    return false;

  };

  this.load = function(geo){

    var mat;

    mat = new THREE.MeshPhongMaterial({color:somecolor, skinning:true})

    this.mesh = new THREE.SkinnedMesh(geo,mat);

    this.mesh.position.x = this.data.position[0];
    this.mesh.position.y = this.data.position[1];
    this.mesh.position.z = this.data.position[2];

    this.parseAnimations();

    scene.add(this.mesh);

    this.playAnimation('Idle');

  };

  this.init = function(){

    var geo;

    if( geoCache[this.data.name] ){
      geo = geoCache[this.data.name];
      this.load(geo); 
    }else{
       geo = loader.parse(JSON.parse(this.data.json)).geometry;
       geoCache[this.data.name] = geo;
       this.load(geo);            
    }        

  };

  this.init();

};

var dataArray = [{name:'MaleWarrior',json:'json_data',position:[x,y,z]},{name:'FemaleWarrior',json:'json_data',position:[x,y,z]},{name:'MaleWarrior',json:'json_data',position:[x,y,z]}];

for(var i=0, len=objectArray.length; i<len; i++){
  modelArray.push(new _MODEL(dataArray[i]) );
}

在此示例中，第一个 MaleWarrior 将进行动画处理，但第二个则不会。如果有第二个女性，她也不会被动画化，因为动画（即使它是一个新的 THREE.Animation() ）将被视为已初始化并且不会返回任何数据。如果我不检查 playAnimation 中是否存在animations.data，我会收到错误“Uncaught TypeError: Cannot read property 'name' of undefined ” on line 29665”。

我正在做的事情是否绕过了动画缓存并损害了性能？我觉得我失去了一些东西。没有数据的动画如何播放？

每个模型的所有动画名称都是相同的“空闲”、“运行”、“攻击”等。

任何帮助，将不胜感激。如果我不够清楚，请告诉我。我添加了额外的细节。

事实证明这是一个官方的 Three.js 错误。

https://github.com/mrdoob/ Three.js/issues/5516 https://github.com/mrdoob/three.js/issues/5516