Three.js 中预加载 Obj+Mtl 对象答案

【问题标题】：Preloading Obj+Mtl Objects in Three.jsThree.js 中预加载 Obj+Mtl 对象
【发布时间】：2018-05-24 20:00:26
【问题描述】：

我需要使用 Three.js 预加载一些 obj+mtl 文件（这不是同一个文件），并且在加载所有对象后我需要调用另一个函数。

我尝试放置一个布尔变量，该变量在加载每个 obj 时都会发生变化，并执行一个函数来确认是否所有对象都已加载，但由于某种原因页面崩溃，它没有工作。

我有一个数组中的所有 obj 和 mtl 路径。

这是我正在做的一个例子。 http://pastie.org/10297027

我尝试将加载函数放在 for 语句中，但效果不佳

你能帮帮我吗？

【问题讨论】：

你能发布一些代码吗？
这是我正在做的一个例子。 pastie.org/10297027我尝试将加载函数放在for语句中，但效果不佳

标签： javascript three.js

【解决方案1】：

new THREE.MTLLoader()
                    .setPath( 'models/obj/male02/' )
                    .load( 'male02_dds.mtl', function ( materials ) {

                        materials.preload();

                        new THREE.OBJLoader()
                            .setMaterials( materials )
                            .setPath( 'models/obj/male02/' )
                            .load( 'male02.obj', function ( object ) {

                                object.position.y = - 95;
                                scene.add( object );

                            }, onProgress, onError );

                    } );

OBJMTLLoader 是 depricated。您应该结合使用OBJLoader 和MTLLoader。

这是example

【讨论】：

【解决方案2】：

使用 three.js 加载管理器来完成这个任务，这里是如何做到的。

创建经理：

var manager = new THREE.LoadingManager();
manager.onProgress = function ( item, loaded, total ) {
    // this gets called after an object has been loaded
};
manager.onLoad = function () {
    // everything is loaded
    // call your other function
};

使用管理器创建加载器并加载项目：

var OBJMTLLoader = new THREE.OBJMTLLoader( manager );

OBJMTLLoader.load(urlsOBJ[0], urlsMTL[0], function(object) {

    // stuff you do in your callback
    var newObject = object.clone();
    newObject.position.set(140, 10, 10);
    newObject.rotation.x = -99;
    scene.add(newObject);
    objectArray.push(newObject);

});

在 three.js r71 中测试。

【讨论】：