Examples: Improved visual quality in some examples.

examples/webgl_loader_gltf.html

@@ -12,7 +12,7 @@
 			<a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - GLTFLoader<br />
 			Battle Damaged Sci-fi Helmet by
 			<a href="https://sketchfab.com/theblueturtle_" target="_blank" rel="noopener">theblueturtle_</a><br />
-			<a href="https://hdrihaven.com/hdri/?h=pedestrian_overpass" target="_blank" rel="noopener">Pedestrian Overpass</a> by <a href="https://hdrihaven.com/" target="_blank" rel="noopener">HDRI Haven</a>
+			<a href="https://hdrihaven.com/hdri/?h=royal_esplanade" target="_blank" rel="noopener">Royal Esplanade</a> by <a href="https://hdrihaven.com/" target="_blank" rel="noopener">HDRI Haven</a>
 		</div>
 
 		<script type="module">
@@ -38,14 +38,14 @@
 				document.body.appendChild( container );
 
 				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.25, 20 );
-				camera.position.set( - 1.8, 0.9, 2.7 );
+				camera.position.set( - 1.8, 0.6, 2.7 );
 
 				scene = new THREE.Scene();
 
 				new RGBELoader()
 					.setDataType( THREE.UnsignedByteType )
 					.setPath( 'textures/equirectangular/' )
-					.load( 'pedestrian_overpass_1k.hdr', function ( texture ) {
+					.load( 'royal_esplanade_1k.hdr', function ( texture ) {
 
 						var envMap = pmremGenerator.fromEquirectangular( texture ).texture;
 						pmremGenerator.dispose();
@@ -81,6 +81,7 @@
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.toneMapping = THREE.ACESFilmicToneMapping;
 				renderer.outputEncoding = THREE.sRGBEncoding;
 				container.appendChild( renderer.domElement );
 
@@ -88,7 +89,7 @@
 				pmremGenerator.compileEquirectangularShader();
 
 				controls = new OrbitControls( camera, renderer.domElement );
-				controls.target.set( 0, - 0.2, - 0.2 );
+				controls.target.set( 0, 0, - 0.2 );
 				controls.update();
 
 				window.addEventListener( 'resize', onWindowResize, false );

examples/webgl_materials_car.html

@@ -238,7 +238,7 @@
 
 				} );
 
-				bodyMatSelect.selectedIndex = 3;
+				bodyMatSelect.selectedIndex = 2;
 				rimMatSelect.selectedIndex = 5;
 				glassMatSelect.selectedIndex = 0;
 

examples/webgl_materials_physical_transparency.html

@@ -39,7 +39,7 @@
 			var hdrEquirect = new RGBELoader()
 				.setDataType( THREE.UnsignedByteType )
 				.setPath( 'textures/equirectangular/' )
-				.load( 'pedestrian_overpass_1k.hdr', function ( texture ) {
+				.load( 'royal_esplanade_1k.hdr', function ( texture ) {
 
 					init();
 					animate();

examples/webgl_materials_reflectivity.html

@@ -57,7 +57,7 @@
 				gemBackMaterial = new THREE.MeshPhysicalMaterial( {
 					map: null,
 					color: 0x0000ff,
-					metalness: 1.0,
+					metalness: 1,
 					roughness: 0,
 					opacity: 0.5,
 					side: THREE.BackSide,
@@ -70,12 +70,12 @@
 				gemFrontMaterial = new THREE.MeshPhysicalMaterial( {
 					map: null,
 					color: 0x0000ff,
-					metalness: 0.0,
+					metalness: 0,
 					roughness: 0,
-					opacity: 0.15,
+					opacity: 0.25,
 					side: THREE.FrontSide,
 					transparent: true,
-					envMapIntensity: 5,
+					envMapIntensity: 10,
 					premultipliedAlpha: true
 				} );
 
@@ -114,7 +114,7 @@
 				new RGBELoader()
 					.setDataType( THREE.UnsignedByteType )
 					.setPath( 'textures/equirectangular/' )
-					.load( 'pedestrian_overpass_1k.hdr', function ( hdrEquirect ) {
+					.load( 'royal_esplanade_1k.hdr', function ( hdrEquirect ) {
 
 						hdrCubeRenderTarget = pmremGenerator.fromEquirectangular( hdrEquirect );
 						pmremGenerator.dispose();

examples/webgl_tonemapping.html

@@ -134,7 +134,7 @@
 				new RGBELoader()
 					.setDataType( THREE.UnsignedByteType )
 					.setPath( 'textures/equirectangular/' )
-					.load( 'pedestrian_overpass_1k.hdr', function ( hdrEquirect ) {
+					.load( 'venice_sunset_1k.hdr', function ( hdrEquirect ) {
 
 						scene.environment = pmremGenerator.fromEquirectangular( hdrEquirect ).texture;