无法在three.js中应用Matrix

时间:2013-07-21 12:07:14

标签: javascript three.js

我正在尝试从JSON文件运行动画。我正在使用自定义JSON加载器(即不是three.js中包含的加载器)。 所以我有一个名为frames的对象,它包含许多帧,所有帧都有形状信息,还有一个simulation_matrix,它包含动画所需的数据,形式为4by4转换矩阵(从python脚本生成)。 所以我使用this代码进行动画制作.. 和this是要加载的示例JSON脚本。

    // This method is for adding static shapes
    // This works perfectly fine ..
    parent.add_shape = function(frame)
 {   
     var material = new THREE.MeshLambertMaterial({
        color:              frame.shape.color,
        wireframe:          true,
        wireframeLinewidth: 0.1,
        opacity: 0.5
       })

     var geometry = new THREE.CylinderGeometry(frame.shape.radius,frame.shape.radius,frame.shape.height,50,50);
     // mesh_dict dictionary maps a mesh(shape) to its frame
     parent.mesh_dict[frame] = new THREE.Mesh(geometry,material);
     var init_orientation = frame.simulation_matrix[0];
     var orienter = new THREE.Matrix4();
     orienter.elements = [];
     //Since simulation_matrix is generated from python, it is a 
     // list of lists, We need to push it to the elemens of Matrix4 manually ..

     for(var i in init_orientation)
         {
           for(var j in init_orientation[i]) 
           { 
              orienter.elements.push(init_orientation[i][j]) ;
            }
          }  
     parent.mesh_dict[frame].applyMatrix(new THREE.Matrix4());
     parent.mesh_dict[frame].applyMatrix(orienter);
     parent.scene.add(parent.mesh_dict[frame]);
     parent.renderer.render(parent.scene,parent.camera); 
  }                  
    // This method basically takes the meshes defined in add_shape, and 
    // applies simulation matrix to it, and requests animation frame for
    // animation.
  parent.animate = function()
 {

   for(var frame in JSONObj.frames) 
         {
          // defining simulation_matrix in a var.   
          var matrix = JSONObj.frames[frame].simulation_matrix[parent.animation_counter];
          var animation_matrix = new THREE.Matrix4();
          animation_matrix.elements = [];
          // pushing it to a Matrix4   
          for(var i in matrix)
              {
                for(var j in matrix[i]) 
                { 
                   animation_matrix.elements.push(matrix[i][j]) ;
                 }
              }  
         console.log(animation_matrix);
         console.log(animation_matrix.elements);
         // Making sure we are not applying matrix to the earlier transform
         //mesh_dict is a dictionary of meshes, used in creating shapes,mapped to the
         //frame which contains them    
         parent.mesh_dict[JSONObj.frames[frame]].applyMatrix(new THREE.Matrix4());   

         // now applying transform, after setting to identity matrix ...
         parent.mesh_dict[JSONObj.frames[frame]].applyMatrix(animation_matrix);                  

         }    

     console.log(parent.animation_counter);    
     //update timestep ...
     parent.animation_counter++;
     // This is to loop over again and again ...
     // assuming 10 animations frames
     if(parent.animation_counter == 10){ parent.animation_counter = 0; }

     requestAnimationFrame(parent.animate);

 }

问题在于我能够创建多个形状,但是当我在循环中对它们应用模拟矩阵时,其中只有一个是动画,这也是非常意外的方式。

1 个答案:

答案 0 :(得分:0)

好吧,我已经弄清楚出了什么问题。不知何故,所有字典parent.mesh_dict []键都映射到同一个对象,而不是所有对象。现在我调试它,它就像一个魅力。你的观点也是有效的@WestLangley,因为我现在使用mesh.matrix.identity()来完成任务。谢谢,我现在就关闭这个问题。