Skip to content

Instantly share code, notes, and snippets.

@iambigd
Forked from jbreckmckye/AjaxTextureLoader.js
Created December 27, 2018 04:05
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save iambigd/9e060164666371f13c92d1bcbc950c6c to your computer and use it in GitHub Desktop.
Save iambigd/9e060164666371f13c92d1bcbc950c6c to your computer and use it in GitHub Desktop.
Loading THREE textures with onProgress events
const THREE = require('three');
function AjaxTextureLoader() {
/**
* Three's texture loader doesn't support onProgress events, because it uses image tags under the hood.
*
* A simple workaround is to AJAX the file into the cache with a FileLoader, then extract that into a
* texture with a separate TextureLoader call.
*/
THREE.Cache.enabled = true; // turns on shared caching for FileLoader, ImageLoader and TextureLoader
const textureLoader = new THREE.TextureLoader();
const fileLoader = new THREE.FileLoader();
const nop = ()=> {};
function load(url, onLoad, onProgress, onError) {
fileLoader.load(url, loadTextureFromCache, onProgress, onError);
function loadTextureFromCache() {
textureLoader.load(url, onLoad, nop, onError);
}
}
Object.assign(this, textureLoader, {load});
}
module.exports = AjaxTextureLoader;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment