THREE.js不將材料加載到對象上

以前用於ios應用程序的mtl + obj文件將3d pcb芯片加載到場景中。THREE.js不將材料加載到對象上

當使用three.js (r80)加載它時，對象加載和幾何看起來正確，但沒有紋理，顏色或圖像加載到對象上。難道我做錯了什麼？

MTL file

OBJ File

所有在MTL文件中引用的圖像都坐在同一目錄中MTL + OBJ文件，我看到被請求並正確投放到瀏覽器。

在Xcode對象看起來是正確的：

在攪拌機加載，它具有正確的顏色，而不是圖像獲取投射在物體上：

通過three.js所它只是加載黑色物體：

JS代碼我使用：

var camera, scene, renderer; 
    scene = new THREE.Scene(); 
    camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); 
    init(); 

    function init() { 
     var mtlLoader = new THREE.MTLLoader(); 
     mtlLoader.load("Thunderboard.mtl", function(materials) { 
      materials.preload(); 
      var objLoader = new THREE.OBJLoader(); 
      objLoader.setMaterials(materials); 
      objLoader.load("Thunderboard.obj", function (object) { 
       scene.add(object); 
      }); 
     }); 

     camera.position.z = 3; 
     renderer = new THREE.WebGLRenderer({ alpha: true }); 
     renderer.setSize(window.innerWidth, window.innerHeight); 
     document.body.appendChild(renderer.domElement); 
     renderer.render(scene, camera); 
    }

來源

2016-09-15 MattoTodd

您是否嘗試在場景中添加一些燈光？

來源

2016-09-15 18:27:43 adonike

讓有光！ – MattoTodd

顏色都是正確的，但圖像仍然沒有投影到芯片的側面。那裏有任何想法？ – MattoTodd

不確定，但在調用renderer.render之前，圖像可能尚未加載。只是一個想法。在scene.add（object）後面嘗試另一個renderer.render（或調用它）;因爲加載程序以異步方式工作。 – adonike

THREE.js不將材料加載到對象上

回答

相關問題