如何在Three.js中使用回调异步加载多个纹理？

Question

通过回调加载单个纹理很容易，例如：

var loader = new THREE.TextureLoader();
var texture1 = loader.load("https://i.imgur.com/UiTMJzv.png", process);

//called only after texture1 is loaded
function process(){

}

问题是如何才能异步（而不是顺序）加载多个纹理，并且仅在全部加载后才调用处理函数？

Answer 1

您可以为此使用THREE.LoadingManager：

var manager = new THREE.LoadingManager( function() {

    // this onLoad callback is executed when both textures are loaded

} );

var loader = new THREE.TextureLoader( manager );
var texture1 = loader.load( 'texture1.png' );
var texture2 = loader.load( 'texture2.png' );