diff --git a/examples/webgl_loader_gltf.html b/examples/webgl_loader_gltf.html index 9ac48da929b4e2..f88f198633d077 100644 --- a/examples/webgl_loader_gltf.html +++ b/examples/webgl_loader_gltf.html @@ -40,6 +40,9 @@ + + + @@ -52,7 +55,7 @@ } var container, stats, controls; - var camera, scene, renderer, light; + var camera, scene, renderer; init(); animate(); @@ -69,36 +72,43 @@ controls.target.set( 0, - 0.2, - 0.2 ); controls.update(); + scene = new THREE.Scene(); + var urls = [ 'posx.jpg', 'negx.jpg', 'posy.jpg', 'negy.jpg', 'posz.jpg', 'negz.jpg' ]; var loader = new THREE.CubeTextureLoader().setPath( 'textures/cube/Bridge2/' ); - var background = loader.load( urls ); + loader.load( urls, function ( texture ) { - scene = new THREE.Scene(); - scene.background = background; + var pmremGenerator = new THREE.PMREMGenerator( texture ); + pmremGenerator.update( renderer ); - light = new THREE.HemisphereLight( 0xbbbbff, 0x444422 ); - light.position.set( 0, 1, 0 ); - scene.add( light ); + var pmremCubeUVPacker = new THREE.PMREMCubeUVPacker( pmremGenerator.cubeLods ); + pmremCubeUVPacker.update( renderer ); - // model - var loader = new THREE.GLTFLoader().setPath( 'models/gltf/DamagedHelmet/glTF/' ); - loader.load( 'DamagedHelmet.gltf', function ( gltf ) { + var envMap = pmremCubeUVPacker.CubeUVRenderTarget.texture; - gltf.scene.traverse( function ( child ) { + // model - if ( child.isMesh ) { + var loader = new THREE.GLTFLoader().setPath( 'models/gltf/DamagedHelmet/glTF/' ); + loader.load( 'DamagedHelmet.gltf', function ( gltf ) { - child.material.envMap = background; + gltf.scene.traverse( function ( child ) { - } + if ( child.isMesh ) { - } ); + child.material.envMap = envMap; - scene.add( gltf.scene ); + } + + } ); + + scene.add( gltf.scene ); + + } ); - }, undefined, function ( e ) { + pmremGenerator.dispose(); + pmremCubeUVPacker.dispose(); - console.error( e ); + scene.background = texture; } );