Przeglądaj źródła

Examples: Updated ACESFilmicToneMapping settings.

Mr.doob 5 lat temu
rodzic
commit
c8c363c6e9

BIN
examples/screenshots/webgl_materials_car.jpg


BIN
examples/screenshots/webgl_materials_envmaps_exr.jpg


BIN
examples/screenshots/webgl_materials_envmaps_hdr.jpg


BIN
examples/screenshots/webgl_materials_physical_clearcoat.jpg


BIN
examples/screenshots/webgl_materials_physical_transparency.jpg


BIN
examples/screenshots/webgl_materials_variations_physical.jpg


BIN
examples/screenshots/webgl_materials_variations_standard.jpg


BIN
examples/screenshots/webgl_shaders_sky.jpg


BIN
examples/screenshots/webgl_tonemapping.jpg


+ 0 - 1
examples/webgl_loader_gltf.html

@@ -87,7 +87,6 @@
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
-				renderer.toneMappingExposure = 0.8;
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				container.appendChild( renderer.domElement );
 

+ 5 - 4
examples/webgl_materials_car.html

@@ -25,7 +25,7 @@
 			<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> car materials<br/>
 			Ferrari 458 Italia model by <a href="https://sketchfab.com/models/57bf6cc56931426e87494f554df1dab6" target="_blank" rel="noopener">vicent091036</a>
 			<br><br>
-			<span class="colorPicker"><input id="body-color" type="color" value="#000333"></input><br/>Body</span>
+			<span class="colorPicker"><input id="body-color" type="color" value="#ff0000"></input><br/>Body</span>
 			<span class="colorPicker"><input id="details-color" type="color" value="#ffffff"></input><br/>Details</span>
 			<span class="colorPicker"><input id="glass-color" type="color" value="#ffffff"></input><br/>Glass</span>
 		</div>
@@ -60,6 +60,7 @@
 				renderer.setAnimationLoop( render );
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
+				renderer.toneMappingExposure = 1.25;
 				container.appendChild( renderer.domElement );
 
 				window.addEventListener( 'resize', onWindowResize, false );
@@ -70,7 +71,7 @@
 				//
 
 				camera = new THREE.PerspectiveCamera( 30, window.innerWidth / window.innerHeight, 0.1, 100 );
-				camera.position.set( 6, 2, - 5 );
+				camera.position.set( 5, 2.5, - 6 );
 
 				controls = new OrbitControls( camera, container );
 				controls.target.set( 0, 0.5, 0 );
@@ -90,7 +91,7 @@
 				// materials
 
 				var bodyMaterial = new THREE.MeshPhysicalMaterial( {
-					color: 0x000333, metalness: 1.0, roughness: 0.5, clearcoat: 0.02, clearcoatRoughness: 0.01
+					color: 0xff0000, metalness: 0.6, roughness: 0.4, clearcoat: 0.05, clearcoatRoughness: 0.05
 				} );
 
 				var detailsMaterial = new THREE.MeshStandardMaterial( {
@@ -98,7 +99,7 @@
 				} );
 
 				var glassMaterial = new THREE.MeshPhysicalMaterial( {
-					color: 0xffffff, metalness: 0, roughness: 0, transparency: 0.8, transparent: true
+					color: 0xffffff, metalness: 0, roughness: 0.1, transparency: 0.9, transparent: true
 				} );
 
 				var bodyColorInput = document.getElementById( 'body-color' );

+ 1 - 1
examples/webgl_materials_envmaps_exr.html

@@ -25,7 +25,7 @@
 				envMap: 'EXR',
 				roughness: 0.0,
 				metalness: 0.0,
-				exposure: 1.0,
+				exposure: 2.0,
 				debug: false,
 			};
 

+ 1 - 1
examples/webgl_materials_envmaps_hdr.html

@@ -28,7 +28,7 @@
 				envMap: 'HDR',
 				roughness: 0.0,
 				metalness: 0.0,
-				exposure: 1.0,
+				exposure: 2.0,
 				debug: false
 			};
 

+ 1 - 1
examples/webgl_materials_physical_clearcoat.html

@@ -176,7 +176,7 @@
 				//
 
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
-				renderer.toneMappingExposure = 1;
+				renderer.toneMappingExposure = 2;
 
 				//
 

+ 0 - 1
examples/webgl_materials_variations_physical.html

@@ -159,7 +159,6 @@
 
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
-				renderer.toneMappingExposure = 0.75;
 
 				//
 

+ 0 - 1
examples/webgl_materials_variations_standard.html

@@ -164,7 +164,6 @@
 
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
-				renderer.toneMappingExposure = 0.75;
 
 				//
 

+ 1 - 1
examples/webgl_shaders_sky.html

@@ -98,7 +98,7 @@
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				renderer.toneMapping = THREE.ACESFilmicToneMapping;
-				renderer.toneMappingExposure = 0.25;
+				renderer.toneMappingExposure = 0.5;
 				document.body.appendChild( renderer.domElement );
 
 				controls = new OrbitControls( camera, renderer.domElement );

+ 1 - 1
examples/webgl_tonemapping.html

@@ -28,7 +28,7 @@
 			var gui, guiExposure = null;
 
 			var params = {
-				exposure: 0.8,
+				exposure: 1.5,
 				toneMapping: 'ACESFilmic'
 			};