配列にThree.jsオブジェクト

Question

私はThree.jsの初心者です。私は私の 'palmtree'オブジェクトを配列にプッシュしたいと思います。私のコードは大丈夫だと思います。

私はvar objects = [];です。

し、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); 
    }); 
}); 

結果が正常に見えます。私は現場に私のpalmtreeを持っています。しかし、私が試してみるとobjects.length私は0を得る..私は何が間違っているのか分からない。

パームツリーをオブジェクト配列にプッシュするにはどうすればよいですか？どうもありがとう。

Answer 1

ここでは何か根本的な欠点があると思います。オブジェクトのロードは非同期な処理なので、コールバックメソッドの外側のobjects.lengthを呼び出すと、手のひらツリーがまだロードされていないため、配列の長さが0になる可能性があります。

しかし、このように、たとえば、コールバックでobjects.lengthをチェックするために、一度試してみてください。それは、出力1なります。この場合

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

。

したがって、配列の長さは、ロード処理が完了し、コールバックが実行された後にのみ1を返します。