From 927d8018adc0e915aa57d5e4882d8fc8e2718222 Mon Sep 17 00:00:00 2001 From: Michael Herzog Date: Sun, 2 May 2021 11:34:37 +0200 Subject: [PATCH] Examples: Clean up. (#21767) --- examples/js/loaders/MD2Loader.js | 2 +- examples/js/postprocessing/SSAARenderPass.js | 27 ++++++++++++++---- .../webgl_materials_physical_reflectivity.jpg | Bin 8343 -> 7026 bytes ...webgl_materials_physical_reflectivity.html | 7 +++-- examples/webgl_materials_physical_sheen.html | 11 +++---- 5 files changed, 31 insertions(+), 16 deletions(-) diff --git a/examples/js/loaders/MD2Loader.js b/examples/js/loaders/MD2Loader.js index 436ff386ab..7881838637 100644 --- a/examples/js/loaders/MD2Loader.js +++ b/examples/js/loaders/MD2Loader.js @@ -102,7 +102,6 @@ const translation = new THREE.Vector3(); const scale = new THREE.Vector3(); - const string = []; const 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 ) ); translation.set( data.getFloat32( offset + 12, true ), data.getFloat32( offset + 16, true ), data.getFloat32( offset + 20, true ) ); offset += 24; + const string = []; for ( let j = 0; j < 16; j ++ ) { diff --git a/examples/js/postprocessing/SSAARenderPass.js b/examples/js/postprocessing/SSAARenderPass.js index fdbb182ec3..d07fbf0909 100644 --- a/examples/js/postprocessing/SSAARenderPass.js +++ b/examples/js/postprocessing/SSAARenderPass.js @@ -80,8 +80,16 @@ const baseSampleWeight = 1.0 / jitterOffsets.length; const roundingRange = 1 / 32; 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 ++ ) { @@ -89,8 +97,8 @@ 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.setClearColor( this._oldClearColor, oldClearAlpha ); diff --git a/examples/screenshots/webgl_materials_physical_reflectivity.jpg b/examples/screenshots/webgl_materials_physical_reflectivity.jpg index 2b3424ad108549a6edae09e86c58bd05f90dc77b..de7b7c7e8bd6bcd7782af59e4840068ae976629e 100644 GIT binary patch delta 4066 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 diff --git a/examples/webgl_materials_physical_reflectivity.html b/examples/webgl_materials_physical_reflectivity.html index 068ecdfeea..dae983721a 100644 --- a/examples/webgl_materials_physical_reflectivity.html +++ b/examples/webgl_materials_physical_reflectivity.html @@ -29,9 +29,9 @@ const params = { projection: 'normal', autoRotate: true, - reflectivity: 1.0, + reflectivity: 1, background: false, - exposure: 1.0, + exposure: 1, gemColor: 'Green' }; let camera, scene, renderer; @@ -155,6 +155,7 @@ renderer.setPixelRatio( window.devicePixelRatio ); renderer.setSize( window.innerWidth, window.innerHeight ); renderer.shadowMap.enabled = true; + renderer.toneMapping = THREE.ACESFilmicToneMapping; container.appendChild( renderer.domElement ); renderer.outputEncoding = THREE.sRGBEncoding; @@ -171,7 +172,7 @@ const gui = new GUI(); 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, 'gemColor', [ 'Blue', 'Green', 'Red', 'White', 'Black' ] ); gui.open(); diff --git a/examples/webgl_materials_physical_sheen.html b/examples/webgl_materials_physical_sheen.html index 92e5e11e05..7b67daa2a2 100644 --- a/examples/webgl_materials_physical_sheen.html +++ b/examples/webgl_materials_physical_sheen.html @@ -37,8 +37,7 @@ color: new THREE.Color( 255, 0, 127 ), sheenBRDF: true, sheen: new THREE.Color( 10, 10, 10 ), // corresponds to .04 reflectance - roughness: .9, - exposure: 2, + roughness: 0.9 }; // model @@ -57,7 +56,7 @@ scene = new THREE.Scene(); scene.background = new THREE.Color( 0xbfd1e5 ); - mesh.scale.multiplyScalar( .5 ); + mesh.scale.multiplyScalar( 0.5 ); scene.add( mesh ); // @@ -95,12 +94,12 @@ controls.target.set( 0, 2, 0 ); controls.update(); - directionalLight = new THREE.DirectionalLight( 0xffffff, .5 ); + directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 ); directionalLight.position.set( 0, 10, 0 ); directionalLight.castShadow = true; directionalLight.add( new THREE.Mesh( - new THREE.SphereGeometry( .5 ), + new THREE.SphereGeometry( 0.5 ), new THREE.MeshBasicMaterial( { color: 0xffffff } ) ) ); @@ -141,7 +140,6 @@ gui.add( params, 'sheenBRDF' ).onChange( onUpdate ); gui.addColor( params, 'sheen' ); gui.add( params, 'roughness', 0, 1 ); - gui.add( params, 'exposure', 0, 3 ); gui.open(); onUpdate(); @@ -190,7 +188,6 @@ // - renderer.toneMappingExposure = params.exposure; renderer.render( scene, camera ); } -- GitLab