三.js 对象转数组

Question

I'm just beginner with Three.js. I would like to push my 'palmtree' object to an array. My code should be fine, I think..

I have my var objects = []; .

And inside the init:

var mtlLoader = new THREE.MTLLoader();
mtlLoader.load("objects/palmtree.mtl", function(materials) {
    materials.preload();
    var objLoader = new THREE.OBJLoader();
    objLoader.setMaterials(materials);
    objLoader.load("objects/palmtree.obj", function(palmtree) {
        palmtree.position.x = 205.12577753354344;
        palmtree.position.y = 2;
        palmtree.position.z = -600.0613083252872;
        palmtree.scale.x = 64;
        palmtree.scale.y = 64;
        palmtree.scale.z = 64;
        scene.add(palmtree);
        objects.push( palmtree );
    });
});

The result looks fine. I have my palmtree in the scene. But when I try objects.length I get 0.. I don't understand what is wrong.

How can I push my palmtree to the objects array? Many thanks.

Answer 1

I think your are missing something fundamental here. Object loading is an asynchronous process so if you call objects.length somewhere outside your callback method it will most likely return 0 for the array length since your palm tree has not been loaded yet.

But try once to check objects.length in the callback for example like this:

var mtlLoader = new THREE.MTLLoader();
mtlLoader.load("objects/palmtree.mtl", function(materials) {
    materials.preload();
    var objLoader = new THREE.OBJLoader();
    objLoader.setMaterials(materials);
    objLoader.load("objects/palmtree.obj", function(palmtree) {
        palmtree.position.x = 205.12577753354344;
        palmtree.position.y = 2;
        palmtree.position.z = -600.0613083252872;
        palmtree.scale.x = 64;
        palmtree.scale.y = 64;
        palmtree.scale.z = 64;
        scene.add(palmtree);
        objects.push( palmtree );
        console.log(objects.length); // <-- will output new length
    });
});

In this case it will output 1 .

So the array length will only return 1 after your loading process has finished and the callback has been executed.