Three.js 循环中的加载程序回调问题 - 只接收最后一个值？

Question

我需要循环加载模型，我想要实现的结果是第一个模型 material[0]，第二个模型 material[1]...

但是我的结果是所有机型都有最后的material。我想是因为当函数 create mesh 被调用时，变量 "i" 已经在最后一个值中了。

我遇到了Closure in loop question，但似乎不适用。

有什么帮助吗？

这里是代码：

var loader = new THREE.CTMLoader();
var material = [new THREE.MeshLambertMaterial( { color: 0xffaa00 } ),
                new THREE.MeshLambertMaterial( { color: 0xffffff } )]

for (i = 0; i < material.length; i++) {

    loader.load( "models/ctm/ben.ctm", function( geometry ) {

        var mesh = new THREE.Mesh( geometry, material[i] );
        scene.add( mesh );

    }, { useWorker: true } );

}

Answer 1

将动作放入函数：

function addToScene (material) {
var loader = new THREE.CTMLoader();

var mesh;
loader.load( "models/ctm/ben.ctm", function( geometry ) {

        mesh = new THREE.Mesh( geometry, material );

    }, { useWorker: true } );

scene.add(mesh)
}


var material = [new THREE.MeshLambertMaterial( { color: 0xffaa00 } ),
                new THREE.MeshLambertMaterial( { color: 0xffffff } )]
for (material.length; i++) {

    addToScene (material[i]);

}

Three.js 循环中的加载程序回调问题 - 只接收最后一个值？

Three.js Loader callback issues in loop - only receive last value?

three.js