Three.js OBJLoader 无需向场景添加对象答案

【问题标题】：Three.js OBJLoader without adding object to sceneThree.js OBJLoader 无需向场景添加对象
【发布时间】：2021-08-23 14:30:59
【问题描述】：

我创建了一个用于在 Three.js 中加载 obj 文件的函数。我不想在该函数中直接将对象添加到场景中，而是将其返回给上层函数。

当前代码：

 var loadObjFile = function(modelConfiguration) {
        var mtlLoader = new THREE.MTLLoader();

        mtlLoader.load(modelConfiguration.mtl, function (materials) {
            materials.preload();
            var objLoader = new THREE.OBJLoader();
            objLoader.setMaterials(materials);
            objLoader.load(modelConfiguration.obj, function (object3d) {
                object3d.name = modelConfiguration.name;
                scene.add(object3d);
            });
        });
    };

我尝试过的事情

以不同的方式重写函数。但无法让它返回object3d。示例：

 var loadObjFile = function(modelConfiguration) {
    var mtlLoader = new THREE.MTLLoader();
    var obj;

    mtlLoader.load(modelConfiguration.mtl, function (materials) {
        materials.preload();
        var objLoader = new THREE.OBJLoader();
        objLoader.setMaterials(materials);
        objLoader.load(modelConfiguration.obj, function (object3d) {
            object3d.name = modelConfiguration.name;
            obj = object3d;
        });
    });
    return obj;
};

我没有将 object3d 添加到场景中，而是将其添加到虚拟组并返回该组。它起作用了，但后来我有很多不必要的组。我还尝试使用 group.children[0] 和 group.getObjectByName(modelConfiguration.name) 从组中提取对象，但它也不起作用。示例：

 var loadObjFile = function(modelConfiguration) {
    var mtlLoader = new THREE.MTLLoader();
    var group;

    mtlLoader.load(modelConfiguration.mtl, function (materials) {
        materials.preload();
        var objLoader = new THREE.OBJLoader();
        objLoader.setMaterials(materials);
        objLoader.load(modelConfiguration.obj, function (object3d) {
            object3d.name = modelConfiguration.name;
            group.add(object3d);
        });
    });
    return group; // works, but unneccessary group
    //return group.children[0]; // error: undefined object
    //return group.getObjectByName(modelConfiguration.name); // error: undefined object
};

提前谢谢你！

【问题讨论】：

我认为由于代码的异步特性，将对象返回到外部函数不起作用。当onLoad() 回调触发时，外部函数已经返回。

标签： three.js

【解决方案1】：

使用 lambda：

var loadObjFile = function(modelConfiguration, onObj) {
    var mtlLoader = new THREE.MTLLoader();
    var obj;

    mtlLoader.load(modelConfiguration.mtl, function (materials) {
        materials.preload();
        var objLoader = new THREE.OBJLoader();
        objLoader.setMaterials(materials);
        objLoader.load(modelConfiguration.obj, function (object3d) {
            object3d.name = modelConfiguration.name;
            obj = object3d;
            onObj(obj);
        });
    });
};

使用：

loadObjFile(myModelConfig, function(obj){
    console.log(obj);
})

【讨论】：

非常感谢！使用 lambda 的好主意。完美运行！