Browse Source

Examples: Clean up. (#21767)

Michael Herzog 4 years ago
parent
commit
927d8018ad

+ 1 - 1
examples/js/loaders/MD2Loader.js

@@ -102,7 +102,6 @@
 
 
 			const translation = new THREE.Vector3();
 			const translation = new THREE.Vector3();
 			const scale = new THREE.Vector3();
 			const scale = new THREE.Vector3();
-			const string = [];
 			const frames = [];
 			const frames = [];
 			offset = header.offset_frames;
 			offset = header.offset_frames;
 
 
@@ -111,6 +110,7 @@
 				scale.set( data.getFloat32( offset + 0, true ), data.getFloat32( offset + 4, true ), data.getFloat32( offset + 8, true ) );
 				scale.set( data.getFloat32( offset + 0, true ), data.getFloat32( offset + 4, true ), data.getFloat32( offset + 8, true ) );
 				translation.set( data.getFloat32( offset + 12, true ), data.getFloat32( offset + 16, true ), data.getFloat32( offset + 20, true ) );
 				translation.set( data.getFloat32( offset + 12, true ), data.getFloat32( offset + 16, true ), data.getFloat32( offset + 20, true ) );
 				offset += 24;
 				offset += 24;
+				const string = [];
 
 
 				for ( let j = 0; j < 16; j ++ ) {
 				for ( let j = 0; j < 16; j ++ ) {
 
 

+ 22 - 5
examples/js/postprocessing/SSAARenderPass.js

@@ -80,8 +80,16 @@
 			const baseSampleWeight = 1.0 / jitterOffsets.length;
 			const baseSampleWeight = 1.0 / jitterOffsets.length;
 			const roundingRange = 1 / 32;
 			const roundingRange = 1 / 32;
 			this.copyUniforms[ 'tDiffuse' ].value = this.sampleRenderTarget.texture;
 			this.copyUniforms[ 'tDiffuse' ].value = this.sampleRenderTarget.texture;
-			const width = readBuffer.width,
-				height = readBuffer.height; // render the scene multiple times, each slightly jitter offset from the last and accumulate the results.
+			const viewOffset = {
+				fullWidth: readBuffer.width,
+				fullHeight: readBuffer.height,
+				offsetX: 0,
+				offsetY: 0,
+				width: readBuffer.width,
+				height: readBuffer.height
+			};
+			const originalViewOffset = Object.assign( {}, this.camera.view );
+			if ( originalViewOffset.enabled ) Object.assign( viewOffset, originalViewOffset ); // render the scene multiple times, each slightly jitter offset from the last and accumulate the results.
 
 
 			for ( let i = 0; i < jitterOffsets.length; i ++ ) {
 			for ( let i = 0; i < jitterOffsets.length; i ++ ) {
 
 
@@ -89,8 +97,8 @@
 
 
 				if ( this.camera.setViewOffset ) {
 				if ( this.camera.setViewOffset ) {
 
 
-					this.camera.setViewOffset( width, height, jitterOffset[ 0 ] * 0.0625, jitterOffset[ 1 ] * 0.0625, // 0.0625 = 1 / 16
-						width, height );
+					this.camera.setViewOffset( viewOffset.fullWidth, viewOffset.fullHeight, viewOffset.offsetX + jitterOffset[ 0 ] * 0.0625, viewOffset.offsetY + jitterOffset[ 1 ] * 0.0625, // 0.0625 = 1 / 16
+						viewOffset.width, viewOffset.height );
 
 
 				}
 				}
 
 
@@ -124,7 +132,16 @@
 
 
 			}
 			}
 
 
-			if ( this.camera.clearViewOffset ) this.camera.clearViewOffset();
+			if ( this.camera.setViewOffset && originalViewOffset.enabled ) {
+
+				this.camera.setViewOffset( originalViewOffset.fullWidth, originalViewOffset.fullHeight, originalViewOffset.offsetX, originalViewOffset.offsetY, originalViewOffset.width, originalViewOffset.height );
+
+			} else if ( this.camera.clearViewOffset ) {
+
+				this.camera.clearViewOffset();
+
+			}
+
 			renderer.autoClear = autoClear;
 			renderer.autoClear = autoClear;
 			renderer.setClearColor( this._oldClearColor, oldClearAlpha );
 			renderer.setClearColor( this._oldClearColor, oldClearAlpha );
 
 

BIN
examples/screenshots/webgl_materials_physical_reflectivity.jpg


+ 4 - 3
examples/webgl_materials_physical_reflectivity.html

@@ -29,9 +29,9 @@
 			const params = {
 			const params = {
 				projection: 'normal',
 				projection: 'normal',
 				autoRotate: true,
 				autoRotate: true,
-				reflectivity: 1.0,
+				reflectivity: 1,
 				background: false,
 				background: false,
-				exposure: 1.0,
+				exposure: 1,
 				gemColor: 'Green'
 				gemColor: 'Green'
 			};
 			};
 			let camera, scene, renderer;
 			let camera, scene, renderer;
@@ -155,6 +155,7 @@
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.shadowMap.enabled = true;
 				renderer.shadowMap.enabled = true;
+				renderer.toneMapping = THREE.ACESFilmicToneMapping;
 				container.appendChild( renderer.domElement );
 				container.appendChild( renderer.domElement );
 
 
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				renderer.outputEncoding = THREE.sRGBEncoding;
@@ -171,7 +172,7 @@
 				const gui = new GUI();
 				const gui = new GUI();
 
 
 				gui.add( params, 'reflectivity', 0, 1 );
 				gui.add( params, 'reflectivity', 0, 1 );
-				gui.add( params, 'exposure', 0.1, 2 );
+				gui.add( params, 'exposure', 0, 2 );
 				gui.add( params, 'autoRotate' );
 				gui.add( params, 'autoRotate' );
 				gui.add( params, 'gemColor', [ 'Blue', 'Green', 'Red', 'White', 'Black' ] );
 				gui.add( params, 'gemColor', [ 'Blue', 'Green', 'Red', 'White', 'Black' ] );
 				gui.open();
 				gui.open();

+ 4 - 7
examples/webgl_materials_physical_sheen.html

@@ -37,8 +37,7 @@
 				color: new THREE.Color( 255, 0, 127 ),
 				color: new THREE.Color( 255, 0, 127 ),
 				sheenBRDF: true,
 				sheenBRDF: true,
 				sheen: new THREE.Color( 10, 10, 10 ), // corresponds to .04 reflectance
 				sheen: new THREE.Color( 10, 10, 10 ), // corresponds to .04 reflectance
-				roughness: .9,
-				exposure: 2,
+				roughness: 0.9
 			};
 			};
 
 
 			// model
 			// model
@@ -57,7 +56,7 @@
 				scene = new THREE.Scene();
 				scene = new THREE.Scene();
 				scene.background = new THREE.Color( 0xbfd1e5 );
 				scene.background = new THREE.Color( 0xbfd1e5 );
 
 
-				mesh.scale.multiplyScalar( .5 );
+				mesh.scale.multiplyScalar( 0.5 );
 				scene.add( mesh );
 				scene.add( mesh );
 
 
 				//
 				//
@@ -95,12 +94,12 @@
 				controls.target.set( 0, 2, 0 );
 				controls.target.set( 0, 2, 0 );
 				controls.update();
 				controls.update();
 
 
-				directionalLight = new THREE.DirectionalLight( 0xffffff, .5 );
+				directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
 				directionalLight.position.set( 0, 10, 0 );
 				directionalLight.position.set( 0, 10, 0 );
 				directionalLight.castShadow = true;
 				directionalLight.castShadow = true;
 				directionalLight.add(
 				directionalLight.add(
 					new THREE.Mesh(
 					new THREE.Mesh(
-						new THREE.SphereGeometry( .5 ),
+						new THREE.SphereGeometry( 0.5 ),
 						new THREE.MeshBasicMaterial( { color: 0xffffff } )
 						new THREE.MeshBasicMaterial( { color: 0xffffff } )
 					)
 					)
 				);
 				);
@@ -141,7 +140,6 @@
 				gui.add( params, 'sheenBRDF' ).onChange( onUpdate );
 				gui.add( params, 'sheenBRDF' ).onChange( onUpdate );
 				gui.addColor( params, 'sheen' );
 				gui.addColor( params, 'sheen' );
 				gui.add( params, 'roughness', 0, 1 );
 				gui.add( params, 'roughness', 0, 1 );
-				gui.add( params, 'exposure', 0, 3 );
 				gui.open();
 				gui.open();
 
 
 				onUpdate();
 				onUpdate();
@@ -190,7 +188,6 @@
 
 
 				//
 				//
 
 
-				renderer.toneMappingExposure = params.exposure;
 				renderer.render( scene, camera );
 				renderer.render( scene, camera );
 
 
 			}
 			}