Bladeren bron

Examples: Use blue noise in the SSGI examples.

Reduces visible shimmer and replaces the splotchy flicker structure of
interleaved gradient noise with fine, evenly distributed grain.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Mr.doob 5 dagen geleden
bovenliggende
commit
2fcd8c5e91
2 gewijzigde bestanden met toevoegingen van 14 en 1 verwijderingen
  1. 12 1
      examples/webgpu_postprocessing_ssgi.html
  2. 2 0
      examples/webgpu_postprocessing_ssgi_ballpool.html

+ 12 - 1
examples/webgpu_postprocessing_ssgi.html

@@ -39,6 +39,7 @@
 			import { pass, mrt, output, normalView, diffuseColor, velocity, add, vec3, vec4, packNormalToRGB, unpackRGBToNormal, sample } from 'three/tsl';
 			import { ssgi } from 'three/addons/tsl/display/SSGINode.js';
 			import { traa } from 'three/addons/tsl/display/TRAANode.js';
+			import { blueNoise } from 'three/addons/tsl/math/BlueNoise.js';
 
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
 
@@ -116,6 +117,9 @@
 				giPass.sliceCount.value = 2;
 				giPass.stepCount.value = 8;
 
+				const noiseNode = blueNoise( 2 );
+				giPass.noiseNode = noiseNode;
+
 				// composite
 
 				const gi = giPass.rgb.toInspector( 'SSGI' );
@@ -220,7 +224,8 @@
 				//
 
 				const params = {
-					output: 0
+					output: 0,
+					blueNoise: true
 				};
 
 				const types = { Combined: 0, Direct: 3, AO: 1, GI: 2 };
@@ -238,6 +243,12 @@
 				gui.add( giPass.useLinearThickness, 'value' ).name( 'use linear thickness' );
 				gui.add( giPass.useScreenSpaceSampling, 'value' ).name( 'screen-space sampling' );
 				gui.add( giPass, 'useTemporalFiltering' ).name( 'temporal filtering' ).onChange( updatePostprocessing );
+				gui.add( params, 'blueNoise' ).name( 'blue noise' ).onChange( ( value ) => {
+
+					giPass.noiseNode = ( value === true ) ? noiseNode : null;
+					updatePostprocessing( params.output );
+
+				} );
 
 				function updatePostprocessing( value ) {
 

+ 2 - 0
examples/webgpu_postprocessing_ssgi_ballpool.html

@@ -46,6 +46,7 @@
 			import { pass, mrt, output, normalView, diffuseColor, velocity, add, vec4, packNormalToRGB, unpackRGBToNormal, sample } from 'three/tsl';
 			import { ssgi } from 'three/addons/tsl/display/SSGINode.js';
 			import { traa } from 'three/addons/tsl/display/TRAANode.js';
+			import { blueNoise } from 'three/addons/tsl/math/BlueNoise.js';
 			import { World } from '@perplexdotgg/bounce';
 
 			const BALL_RADIUS = 0.4;
@@ -131,6 +132,7 @@
 				const giPass = ssgi( scenePassColor, scenePassDepth, sceneNormal, camera );
 				giPass.sliceCount.value = 2;
 				giPass.stepCount.value = 8;
+				giPass.noiseNode = blueNoise( 2 );
 
 				// composite
 

粤ICP备19079148号