i wanted to ask if there is a simple solution to preload Textures and Images in ThreeJs. I load them all into an array: myTextureArray.push(new THREE.ImageUtils.loadTexture('../textures/floor_red.jpg');

How can i check if and when all Textures are loaded successfully ?

Here is an older Version Link: /

Thanks for help!

i wanted to ask if there is a simple solution to preload Textures and Images in ThreeJs. I load them all into an array: myTextureArray.push(new THREE.ImageUtils.loadTexture('../textures/floor_red.jpg');

How can i check if and when all Textures are loaded successfully ?

Here is an older Version Link: http://museum.baraq.de/

Thanks for help!

• javascript
• three.js
• textures
• preload

1 Answer 1

There is a Loading Manager in Three.js you can use to keep track of your loaded Textures or Objects.

Example implementation:

var textureManager = new THREE.LoadingManager();
textureManager.onProgress = function ( item, loaded, total ) {
    // this gets called after any item has been loaded
};

textureManager.onLoad = function () {
    // all textures are loaded
    // ...
};

var textureLoader = new THREE.ImageLoader( textureManager );
var myTextureArray = [];
var myTexture = new THREE.Texture();
myTextureArray.push( myTexture );

textureLoader.load( 'my/texture.jpg', function ( image ) {
    myTexture.image = image;
} );

Tested in Three.js r71.