Use PMREMGenerator in webgl_loader_gltf example.

TimeoutY · Feb 26, 2019 · bcd4bec · bcd4bec
1 parent 474b996
commit bcd4bec
Showing 1 changed file with 28 additions and 18 deletions.
diff --git a/examples/webgl_loader_gltf.html b/examples/webgl_loader_gltf.html
@@ -40,6 +40,9 @@
 		<script src="js/controls/OrbitControls.js"></script>
 		<script src="js/loaders/GLTFLoader.js"></script>
 
+		<script src="js/pmrem/PMREMGenerator.js"></script>
+		<script src="js/pmrem/PMREMCubeUVPacker.js"></script>
+
 		<script src="js/WebGL.js"></script>
 		<script src="js/libs/stats.min.js"></script>
 
@@ -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;
 
 				} );