在 THREE.js 中加载多个 Collada 对象答案

【问题标题】：Loading Multiple Collada Objects in THREE.js在 THREE.js 中加载多个 Collada 对象
【发布时间】：2013-05-08 01:23:15
【问题描述】：

我正在使用 THREE.js 中的循环加载多个汽车模型，但问题是有时它会加载所有对象，但有时它不会加载所有对象。例如，如果循环是 3 次迭代，它有时会加载 2 个对象，有时会加载 1 个，有时会加载所有三个对象。我不知道为什么？我搜索了很多，但找不到任何有用的东西。这是代码。

for (var k = 1; k <= myWorld.noOfEnemies(); k++) {

                myWorld.setWorldEnemyCar(k);

                loader2.load('obj/us/us_police_car.dae', function colladaReady(collada) {
                    object3 = collada.scene;

                    object3.scale.x = object3.scale.y = object3.scale.z = 2;
                    object3.updateMatrix();
                    object3.position.x = myWorld.enemyCar.position.x;
                    object3.position.y = myWorld.enemyCar.position.y;
                    object3.position.z = myWorld.enemyCar.position.z;

                    object3.rotation.x = -(Math.PI / 2);

                    object3.rotation.z = (Math.PI / 2);
                    enemyModels.push(object3);
                    //localObject.rotation.z = -(Math.PI / 2);
                    //collidableMeshList3 = localObject;
                    //console.log(collidableMeshList3);

                    // init();

                    // animate();

                });

            }

在我拥有init() 和animate() 函数的另一个加载器之后

loader2.load('obj/us/us_police_car.dae', function colladaReady(collada) {
                localObject = collada.scene;

                localObject.scale.x = localObject.scale.y = localObject.scale.z = 2;
                localObject.updateMatrix();
                localObject.position.x = 0;
                localObject.position.y = 0;
                localObject.position.z = 0;

                localObject.rotation.x = -(Math.PI / 2);

                localObject.rotation.z = (Math.PI / 2);

                //localObject.rotation.z = -(Math.PI / 2);
                //collidableMeshList3 = localObject;
                //console.log(collidableMeshList3);
                //scene.add(localObject);

                init();

                animate();

            });

这工作正常，但无法弄清楚上面的问题是什么。

【问题讨论】：

在使用单个加载程序实例加载多个 collada 文件时，collada 加载程序似乎存在错误 [github.com/mrdoob/three.js/issues/5721]，请参阅下面的答案。

标签： javascript three.js

【解决方案1】：

当重新使用同一个 collada 加载器实例来加载多个 collada 文件时，似乎有一个known issue。

以下代码对我来说工作可靠（至少在 chrome 和 firefox 中）：

scene = new THREE.Scene();

// setup lighting etc.

load('/path/someColladaModel.dae');
load("/path/someOtherColladaModel.dae");
load("/path/yetAnotherColladaModel.dae");

function load(daeLocation){
    var manager = new THREE.LoadingManager();
    manager.onProgress = function(item, loaded, total) {
        console.log(item, loaded, total);
    };

    var loader = new THREE.ColladaLoader(manager);
    loader.options.convertUpAxis = true;

    loader.load(daeLocation, function(collada) {
            dae = collada.scene;
            dae.position.set(0, 0, 0); 
            scene.add(dae);
            render();
        }, function(progress) {
            // show some progress
    });
}

请注意，每次加载模型时，我都会实例化一个新的加载器。

【讨论】：

【解决方案2】：

只需制作您自己的异步加载器。您的问题是您使用异步功能作为同步。你永远不知道异步函数在哪里结束以及它运行后的代码，而无需等待它结束。这是一个通用的 javascript 问题，而不仅仅是三个.js

loader = function(files,callback){
    var i = 0;
    var objects = new Array();
    files.forEach(function(file){
        loader2.load('obj/us/us_police_car.dae', function colladaReady(collada) {
            objects[i] = collada.scene;
            (... rest of the code for each object)
            i++;
            if (i == files.length) {
                callback(objects);
            }
        } 
    });
}

【讨论】：

我制作了一个同步加载的版本，但这并不能解决问题。它显然与异步无关。

【解决方案3】：

我遇到了同样的问题。显然 Collada 加载器当前无法处理加载多个文件。我通过将所有对象放在一个文件中来解决它，然后当它完成加载时，我找到各个对象并分别使用它们。希望这会有所帮助，并且这是您的选择。

【讨论】：

你能详细说明你做了什么吗？我不能完全理解你的想法。顺便说一句：谢谢
问题是它有时会加载所有对象，有时会加载两个，有时会加载一个，有时什么也不加载。这是加载程序问题还是循环或循环中名称为enemyModels 的数组的某些问题，因为这在循环之外几乎没有任何内容。
查看我的答案 - 这是错误 [github.com/mrdoob/three.js/issues/5721] 您可以通过实例化多个 collada 加载器来解决此问题。

【解决方案4】：

如果您要多次加载同一个模型，则无需为每个模型调用加载程序。您可以克隆网格：

    // queen is a mesh
    var newQueen = queen.clone();
    // make sure to re position to be able to see the new queen!
    newQueen.position.set(100,100,100); // or any other coordinates

【讨论】：

【解决方案5】：

我刚刚确定这个问题是 3js collada 加载程序中的一个错误，他们有一个新的加载程序，据说没有这个问题，但它还没有发布（2015 年 12 月），你可以在开发树中找到它。见https://github.com/mrdoob/three.js/issues/7388

【讨论】：