THREE.js 没有将材料加载到对象上答案

【问题标题】：THREE.js not loading materials onto objectTHREE.js 没有将材料加载到对象上
【发布时间】：2017-01-23 21:02:51
【问题描述】：

获取之前在 ios 应用中使用的 mtl+obj 文件，将 3d pcb 芯片加载到场景中。

当使用three.js (r80) 加载它时，对象加载并且几何看起来正确，但是没有纹理、颜色或图像加载到对象上。我是不是做错了什么？

MTL file

OBJ File

mtl 文件中引用的所有图像都与 mtl+obj 文件位于同一目录中，我看到这些图像被正确地请求并提供给浏览器。

在 XCode 中，对象看起来是正确的：

在 Blender 中加载，它具有正确的颜色，但没有图像投射到对象上：

通过 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 );
    }

【问题讨论】：

标签： javascript 3d three.js

【解决方案1】：

您是否尝试在场景中添加一些灯光？

【讨论】：

要有光！
颜色都正确，但图像仍然没有投影到芯片的侧面。有什么想法吗？
不确定，但在您调用 renderer.render 之前，可能还没有加载图像。只是一个想法。在 scene.add(object); 之后尝试另一个 renderer.render（或调用它）；因为加载器以异步方式工作。
这似乎不是问题。 :(
我已经在本地测试了您的代码，但没有成功。我现在只能假设您的 obj 文件中可能缺少法线和/或 UV。我只是猜测。