如何紋理從攪拌器導出的動畫js模型？ [Three.js]

我已成功使用骨骼動畫技術在混合器中爲動畫製作模型，並且我還在使用UV紋理的混合器中對其進行了紋理處理。然後在blender中使用three.js導出附加組件，我已經導出了模型，確保簽入的uv和動畫。但是我不知道爲動畫模型加載紋理的技術。我查看了包含在three.js中的變形正常示例，其中使用朗伯材質使用了簡單的顏色紋理。我從外部文件中獲取紋理。我如何加載紋理。在js動畫模型文件中有紋理的位置，它位於相同的位置。但它不加載。我也使用了面部材料技術。如何紋理從攪拌器導出的動畫js模型？ [Three.js]

爲three.js所例如位置，我用修改：

http://threejs.org/examples/webgl_morphnormals.html

這裏是我的代碼：

var loader = new THREE.JSONLoader(); 
      loader.load("bird_final.js", function(geometry, materials) { 

       morphColorsToFaceColors(geometry); 
       geometry.computeMorphNormals(); 

       // the old code to set color to the model 

       //var material = new THREE.MeshLambertMaterial({ color: 0xffffff, morphTargets: true, morphNormals: true, vertexColors: THREE.FaceColors, shading: THREE.SmoothShading }); 

       // my code 
       var meshAnim = new THREE.MorphAnimMesh(geometry, new THREE.MeshFaceMaterial(materials)); 

       meshAnim.duration = 500; 

       meshAnim.scale.set(20, 20, 20); 
       meshAnim.position.y = 150; 
       meshAnim.position.x = -100; 


       scene1.add(meshAnim); 
       morphs.push(meshAnim); 

      });

除了文檔和散佈在網絡上的一些基本教程，有什麼地方我可以從頭開始學習three.js。像我知道設置場景和創建基本的幾何東西，但一些細節信息，如加載紋理模型加載場景等。

來源

2013-05-20 monk

處理複雜的幾何，材料，紋理和動畫是一些最難搞清楚三。 js--這就是我們爲什麼從編輯開始。

我們使這些都變得簡單。從Blender導出FBX文件（或OBJ/MTL或Collada）。將它帶入Verold Studio中的項目，然後使用我們的加載器將其加載到您的THREE.js程序中。服務可免費使用，如果您需要啓用服務或希望獲得維護/支持協議的客戶，您需要支付我們的費用。

參見下面的例子，不能更容易地使你的場景three.js所，

http://jsfiddle.net/rossmckegney/EeMCk/

 // 1. Set and then start the animation :) 
    this.model.setAnimation("mixamo.com"); 
    this.model.playAnimation(true); 
    //this.model.pauseAnimation(); 

    // 2. Get the threedata for a model 
    console.log(this.model.threeData); 

    // 3. Move the model 
    this.tweenObjectTo(
     this.model.threeData,    // the model 
     new THREE.Vector3(1, 0, 0),   // go to 
     new THREE.Quaternion(),    // rotation 
     1,         // time, in seconds 
     false,        // smooth start 
     true);        // smooth end 

     // 4. Clone the model 
     that = this; 
     this.model2 = this.model.clone({ 
     success_hierarchy: function(clonedModel) { 
      that.veroldEngine.getActiveScene().addChildObject(clonedModel); 
     } 
     });

來源

2013-05-21 10:55:21 rossmckegney

我已經創作了一系列的評論例子爲說明功能three.js所一次一個，從非常基本的功能開始，進入更高級的功能（包括加載模型）。

http://stemkoski.github.io/Three.js

希望這有助於！

來源

2013-05-26 17:06:05

哇，你在那裏做了相當棒的工作。謝謝我一定會沿着 – monk

+1進行您的網站示例 – olanod

高興得到援助:) –

如何紋理從攪拌器導出的動畫js模型？ [Three.js]

回答

相關問題