three-gpu-pathtracer 0.0.16 → 0.0.18

package/src/textures/ProceduralEquirectTexture.js

@@ -3,12 +3,12 @@ import {
 	Color,
 	DataTexture,
 	EquirectangularReflectionMapping,
-	FloatType,
 	LinearFilter,
 	RepeatWrapping,
 	RGBAFormat,
 	Spherical,
 	Vector2,
+	FloatType
 } from 'three';
 
 const _uv = new Vector2();
@@ -17,7 +17,7 @@ const _polar = new Spherical();
 const _color = new Color();
 export class ProceduralEquirectTexture extends DataTexture {
 
-	constructor( width, height ) {
+	constructor( width = 512, height = 512 ) {
 
 		super(
 			new Float32Array( width * height * 4 ),
@@ -53,10 +53,10 @@ export class ProceduralEquirectTexture extends DataTexture {
 
 				const i = y * width + x;
 				const i4 = 4 * i;
-				data[ i4 + 0 ] = _color.r;
-				data[ i4 + 1 ] = _color.g;
-				data[ i4 + 2 ] = _color.b;
-				data[ i4 + 3 ] = 1.0;
+				data[ i4 + 0 ] = ( _color.r );
+				data[ i4 + 1 ] = ( _color.g );
+				data[ i4 + 2 ] = ( _color.b );
+				data[ i4 + 3 ] = ( 1.0 );
 
 			}
 

package/src/textures/blueNoise/BlueNoiseGenerator.js

@@ -0,0 +1,115 @@
+import { shuffleArray, fillWithOnes } from './utils.js';
+import { BlueNoiseSamples } from './BlueNoiseSamples.js';
+
+export class BlueNoiseGenerator {
+
+	constructor() {
+
+		this.random = Math.random;
+		this.sigma = 1.5;
+		this.size = 64;
+		this.majorityPointsRatio = 0.1;
+
+		this.samples = new BlueNoiseSamples( 1 );
+		this.savedSamples = new BlueNoiseSamples( 1 );
+
+	}
+
+	generate() {
+
+		// http://cv.ulichney.com/papers/1993-void-cluster.pdf
+
+		const {
+			samples,
+			savedSamples,
+			sigma,
+			majorityPointsRatio,
+			size,
+		} = this;
+
+		samples.resize( size );
+		samples.setSigma( sigma );
+
+		// 1. Randomly place the minority points.
+		const pointCount = Math.floor( size * size * majorityPointsRatio );
+		const initialSamples = samples.binaryPattern;
+
+		fillWithOnes( initialSamples, pointCount );
+		shuffleArray( initialSamples, this.random );
+
+		for ( let i = 0, l = initialSamples.length; i < l; i ++ ) {
+
+			if ( initialSamples[ i ] === 1 ) {
+
+				samples.addPointIndex( i );
+
+			}
+
+		}
+
+		// 2. Remove minority point that is in densest cluster and place it in the largest void.
+		while ( true ) {
+
+			const clusterIndex = samples.findCluster();
+			samples.removePointIndex( clusterIndex );
+
+			const voidIndex = samples.findVoid();
+			if ( clusterIndex === voidIndex ) {
+
+				samples.addPointIndex( clusterIndex );
+				break;
+
+			}
+
+			samples.addPointIndex( voidIndex );
+
+		}
+
+		// 3. PHASE I: Assign a rank to each progressively less dense cluster point and put it
+		// in the dither array.
+		const ditherArray = new Uint32Array( size * size );
+		savedSamples.copy( samples );
+
+		let rank;
+		rank = samples.count - 1;
+		while ( rank >= 0 ) {
+
+			const clusterIndex = samples.findCluster();
+			samples.removePointIndex( clusterIndex );
+
+			ditherArray[ clusterIndex ] = rank;
+			rank --;
+
+		}
+
+		// 4. PHASE II: Do the same thing for the largest voids up to half of the total pixels using
+		// the initial binary pattern.
+		const totalSize = size * size;
+		rank = savedSamples.count;
+		while ( rank < totalSize / 2 ) {
+
+			const voidIndex = savedSamples.findVoid();
+			savedSamples.addPointIndex( voidIndex );
+			ditherArray[ voidIndex ] = rank;
+			rank ++;
+
+		}
+
+		// 5. PHASE III: Invert the pattern and finish out by assigning a rank to the remaining
+		// and iteratively removing them.
+		savedSamples.invert();
+
+		while ( rank < totalSize ) {
+
+			const clusterIndex = savedSamples.findCluster();
+			savedSamples.removePointIndex( clusterIndex );
+			ditherArray[ clusterIndex ] = rank;
+			rank ++;
+
+		}
+
+		return { data: ditherArray, maxValue: totalSize };
+
+	}
+
+}

package/src/textures/blueNoise/BlueNoiseSamples.js

@@ -0,0 +1,214 @@
+export class BlueNoiseSamples {
+
+	constructor( size ) {
+
+		this.count = 0;
+		this.size = - 1;
+		this.sigma = - 1;
+		this.radius = - 1;
+		this.lookupTable = null;
+		this.score = null;
+		this.binaryPattern = null;
+
+		this.resize( size );
+		this.setSigma( 1.5 );
+
+	}
+
+	findVoid() {
+
+		const { score, binaryPattern } = this;
+
+		let currValue = Infinity;
+		let currIndex = - 1;
+		for ( let i = 0, l = binaryPattern.length; i < l; i ++ ) {
+
+			if ( binaryPattern[ i ] !== 0 ) {
+
+				continue;
+
+			}
+
+			const pScore = score[ i ];
+			if ( pScore < currValue ) {
+
+				currValue = pScore;
+				currIndex = i;
+
+			}
+
+		}
+
+		return currIndex;
+
+	}
+
+	findCluster() {
+
+		const { score, binaryPattern } = this;
+
+		let currValue = - Infinity;
+		let currIndex = - 1;
+		for ( let i = 0, l = binaryPattern.length; i < l; i ++ ) {
+
+			if ( binaryPattern[ i ] !== 1 ) {
+
+				continue;
+
+			}
+
+			const pScore = score[ i ];
+			if ( pScore > currValue ) {
+
+				currValue = pScore;
+				currIndex = i;
+
+			}
+
+		}
+
+		return currIndex;
+
+	}
+
+	setSigma( sigma ) {
+
+		if ( sigma === this.sigma ) {
+
+			return;
+
+		}
+
+		// generate a radius in which the score will be updated under the
+		// assumption that e^-10 is insignificant enough to be the border at
+		// which we drop off.
+		const radius = ~ ~ ( Math.sqrt( 10 * 2 * ( sigma ** 2 ) ) + 1 );
+		const lookupWidth = 2 * radius + 1;
+		const lookupTable = new Float32Array( lookupWidth * lookupWidth );
+		const sigma2 = sigma * sigma;
+		for ( let x = - radius; x <= radius; x ++ ) {
+
+			for ( let y = - radius; y <= radius; y ++ ) {
+
+				const index = ( radius + y ) * lookupWidth + x + radius;
+				const dist2 = x * x + y * y;
+				lookupTable[ index ] = Math.E ** ( - dist2 / ( 2 * sigma2 ) );
+
+			}
+
+		}
+
+		this.lookupTable = lookupTable;
+		this.sigma = sigma;
+		this.radius = radius;
+
+	}
+
+	resize( size ) {
+
+		if ( this.size !== size ) {
+
+			this.size = size;
+			this.score = new Float32Array( size * size );
+			this.binaryPattern = new Uint8Array( size * size );
+
+		}
+
+
+	}
+
+	invert() {
+
+		const { binaryPattern, score, size } = this;
+
+		score.fill( 0 );
+
+		for ( let i = 0, l = binaryPattern.length; i < l; i ++ ) {
+
+			if ( binaryPattern[ i ] === 0 ) {
+
+				const y = ~ ~ ( i / size );
+				const x = i - y * size;
+				this.updateScore( x, y, 1 );
+				binaryPattern[ i ] = 1;
+
+			} else {
+
+				binaryPattern[ i ] = 0;
+
+			}
+
+		}
+
+	}
+
+	updateScore( x, y, multiplier ) {
+
+		// TODO: Is there a way to keep track of the highest and lowest scores here to avoid have to search over
+		// everything in the buffer?
+		const { size, score, lookupTable } = this;
+
+		// const sigma2 = sigma * sigma;
+		// const radius = Math.floor( size / 2 );
+		const radius = this.radius;
+		const lookupWidth = 2 * radius + 1;
+		for ( let px = - radius; px <= radius; px ++ ) {
+
+			for ( let py = - radius; py <= radius; py ++ ) {
+
+				// const dist2 = px * px + py * py;
+				// const value = Math.E ** ( - dist2 / ( 2 * sigma2 ) );
+
+				const lookupIndex = ( radius + py ) * lookupWidth + px + radius;
+				const value = lookupTable[ lookupIndex ];
+
+				let sx = ( x + px );
+				sx = sx < 0 ? size + sx : sx % size;
+
+				let sy = ( y + py );
+				sy = sy < 0 ? size + sy : sy % size;
+
+				const sindex = sy * size + sx;
+				score[ sindex ] += multiplier * value;
+
+			}
+
+		}
+
+	}
+
+	addPointIndex( index ) {
+
+		this.binaryPattern[ index ] = 1;
+
+		const size = this.size;
+		const y = ~ ~ ( index / size );
+		const x = index - y * size;
+		this.updateScore( x, y, 1 );
+		this.count ++;
+
+	}
+
+	removePointIndex( index ) {
+
+		this.binaryPattern[ index ] = 0;
+
+		const size = this.size;
+		const y = ~ ~ ( index / size );
+		const x = index - y * size;
+		this.updateScore( x, y, - 1 );
+		this.count --;
+
+	}
+
+	copy( source ) {
+
+		this.resize( source.size );
+		this.score.set( source.score );
+		this.binaryPattern.set( source.binaryPattern );
+		this.setSigma( source.sigma );
+		this.count = source.count;
+
+	}
+
+}

package/src/textures/blueNoise/utils.js

@@ -0,0 +1,24 @@
+export function shuffleArray( array, random = Math.random ) {
+
+	for ( let i = array.length - 1; i > 0; i -- ) {
+
+		const replaceIndex = ~ ~ ( ( random() - 1e-6 ) * i );
+		const tmp = array[ i ];
+		array[ i ] = array[ replaceIndex ];
+		array[ replaceIndex ] = tmp;
+
+	}
+
+}
+
+export function fillWithOnes( array, count ) {
+
+	array.fill( 0 );
+
+	for ( let i = 0; i < count; i ++ ) {
+
+		array[ i ] = 1;
+
+	}
+
+}

package/src/uniforms/EquirectHdrInfoUniform.js

@@ -1,4 +1,5 @@
-import { DataTexture, FloatType, RedFormat, LinearFilter, DataUtils, HalfFloatType, Source, RepeatWrapping, RGBAFormat } from 'three';
+import { DataTexture, RedFormat, LinearFilter, DataUtils, HalfFloatType, Source, RepeatWrapping, RGBAFormat, FloatType, ClampToEdgeWrapping } from 'three';
+import { toHalfFloatArray } from '../utils/TextureUtils.js';
 
 function binarySearchFindClosestIndexOf( array, targetValue, offset = 0, count = array.length ) {
 
@@ -38,7 +39,7 @@ function colorToLuminance( r, g, b ) {
 }
 
 // ensures the data is all floating point values and flipY is false
-function preprocessEnvMap( envMap ) {
+function preprocessEnvMap( envMap, targetType = HalfFloatType ) {
 
 	const map = envMap.clone();
 	map.source = new Source( { ...map.image } );
@@ -47,17 +48,54 @@ function preprocessEnvMap( envMap ) {
 	// TODO: is there a simple way to avoid cloning and adjusting the env map data here?
 	// convert the data from half float uint 16 arrays to float arrays for cdf computation
 	let newData = data;
-	if ( map.type === HalfFloatType ) {
+	if ( map.type !== targetType ) {
 
-		newData = new Float32Array( data.length );
-		for ( const i in data ) {
+		if ( targetType === HalfFloatType ) {
 
-			newData[ i ] = DataUtils.fromHalfFloat( data[ i ] );
+			newData = new Uint16Array( data.length );
+
+		} else {
+
+			newData = new Float32Array( data.length );
+
+		}
+
+		let maxIntValue;
+		if ( data instanceof Int8Array || data instanceof Int16Array || data instanceof Int32Array ) {
+
+			maxIntValue = 2 ** ( 8 * data.BYTES_PER_ELEMENT - 1 ) - 1;
+
+		} else {
+
+			maxIntValue = 2 ** ( 8 * data.BYTES_PER_ELEMENT ) - 1;
+
+		}
+
+		for ( let i = 0, l = data.length; i < l; i ++ ) {
+
+			let v = data[ i ];
+			if ( map.type === HalfFloatType ) {
+
+				v = DataUtils.fromHalfFloat( data[ i ] );
+
+			}
+
+			if ( map.type !== FloatType && map.type !== HalfFloatType ) {
+
+				v /= maxIntValue;
+
+			}
+
+			if ( targetType === HalfFloatType ) {
+
+				newData[ i ] = DataUtils.toHalfFloat( v );
+
+			}
 
 		}
 
 		map.image.data = newData;
-		map.type = FloatType;
+		map.type = targetType;
 
 	}
 
@@ -98,8 +136,8 @@ export class EquirectHdrInfoUniform {
 
 		// Default to a white texture and associated weights so we don't
 		// just render black initially.
-		const whiteTex = new DataTexture( new Float32Array( [ 1, 1, 1, 1 ] ), 1, 1 );
-		whiteTex.type = FloatType;
+		const whiteTex = new DataTexture( toHalfFloatArray( new Float32Array( [ 1, 1, 1, 1 ] ) ), 1, 1 );
+		whiteTex.type = HalfFloatType;
 		whiteTex.format = RGBAFormat;
 		whiteTex.minFilter = LinearFilter;
 		whiteTex.magFilter = LinearFilter;
@@ -110,8 +148,8 @@ export class EquirectHdrInfoUniform {
 
 		// Stores a map of [0, 1] value -> cumulative importance row & pdf
 		// used to sampling a random value to a relevant row to sample from
-		const marginalWeights = new DataTexture( new Float32Array( [ 0, 1 ] ), 1, 2 );
-		marginalWeights.type = FloatType;
+		const marginalWeights = new DataTexture( toHalfFloatArray( new Float32Array( [ 0, 1 ] ) ), 1, 2 );
+		marginalWeights.type = HalfFloatType;
 		marginalWeights.format = RedFormat;
 		marginalWeights.minFilter = LinearFilter;
 		marginalWeights.magFilter = LinearFilter;
@@ -120,8 +158,8 @@ export class EquirectHdrInfoUniform {
 
 		// Stores a map of [0, 1] value -> cumulative importance column & pdf
 		// used to sampling a random value to a relevant pixel to sample from
-		const conditionalWeights = new DataTexture( new Float32Array( [ 0, 0, 1, 1 ] ), 2, 2 );
-		conditionalWeights.type = FloatType;
+		const conditionalWeights = new DataTexture( toHalfFloatArray( new Float32Array( [ 0, 0, 1, 1 ] ) ), 2, 2 );
+		conditionalWeights.type = HalfFloatType;
 		conditionalWeights.format = RedFormat;
 		conditionalWeights.minFilter = LinearFilter;
 		conditionalWeights.magFilter = LinearFilter;
@@ -149,7 +187,7 @@ export class EquirectHdrInfoUniform {
 		// https://pbr-book.org/3ed-2018/Light_Transport_I_Surface_Reflection/Sampling_Light_Sources#InfiniteAreaLights
 		const map = preprocessEnvMap( hdr );
 		map.wrapS = RepeatWrapping;
-		map.wrapT = RepeatWrapping;
+		map.wrapT = ClampToEdgeWrapping;
 
 		const { width, height, data } = map.image;
 
@@ -171,9 +209,9 @@ export class EquirectHdrInfoUniform {
 			for ( let x = 0; x < width; x ++ ) {
 
 				const i = y * width + x;
-				const r = data[ 4 * i + 0 ];
-				const g = data[ 4 * i + 1 ];
-				const b = data[ 4 * i + 2 ];
+				const r = DataUtils.fromHalfFloat( data[ 4 * i + 0 ] );
+				const g = DataUtils.fromHalfFloat( data[ 4 * i + 1 ] );
+				const b = DataUtils.fromHalfFloat( data[ 4 * i + 2 ] );
 
 				// the probability of the pixel being selected in this row is the
 				// scale of the luminance relative to the rest of the pixels.
@@ -225,8 +263,8 @@ export class EquirectHdrInfoUniform {
 		// the marginal and conditional data. These will be used to sample with a random number
 		// to retrieve a uv value to sample in the environment map.
 		// These values continually increase so it's okay to interpolate between them.
-		const marginalDataArray = new Float32Array( height );
-		const conditionalDataArray = new Float32Array( width * height );
+		const marginalDataArray = new Uint16Array( height );
+		const conditionalDataArray = new Uint16Array( width * height );
 
 		// we add a half texel offset so we're sampling the center of the pixel
 		for ( let i = 0; i < height; i ++ ) {
@@ -234,7 +272,7 @@ export class EquirectHdrInfoUniform {
 			const dist = ( i + 1 ) / height;
 			const row = binarySearchFindClosestIndexOf( cdfMarginal, dist );
 
-			marginalDataArray[ i ] = ( row + 0.5 ) / height;
+			marginalDataArray[ i ] = DataUtils.toHalfFloat( ( row + 0.5 ) / height );
 
 		}
 
@@ -246,7 +284,7 @@ export class EquirectHdrInfoUniform {
 				const dist = ( x + 1 ) / width;
 				const col = binarySearchFindClosestIndexOf( cdfConditional, dist, y * width, width );
 
-				conditionalDataArray[ i ] = ( col + 0.5 ) / width;
+				conditionalDataArray[ i ] = DataUtils.toHalfFloat( ( col + 0.5 ) / width );
 
 			}
 

package/src/uniforms/IESProfilesTexture.js

@@ -1,7 +1,7 @@
 import {
 	ClampToEdgeWrapping,
 	Color,
-	FloatType,
+	HalfFloatType,
 	LinearFilter,
 	MeshBasicMaterial,
 	NoToneMapping,
@@ -20,7 +20,7 @@ export class IESProfilesTexture extends WebGLArrayRenderTarget {
 
 		const tex = this.texture;
 		tex.format = RGBAFormat;
-		tex.type = FloatType;
+		tex.type = HalfFloatType;
 		tex.minFilter = LinearFilter;
 		tex.magFilter = LinearFilter;
 		tex.wrapS = ClampToEdgeWrapping;

package/src/uniforms/LightsInfoUniformStruct.js

@@ -1,4 +1,4 @@
-import { DataTexture, RGBAFormat, ClampToEdgeWrapping, FloatType, Vector3, Quaternion, Matrix4 } from 'three';
+import { DataTexture, RGBAFormat, ClampToEdgeWrapping, FloatType, Vector3, Quaternion, Matrix4, NearestFilter } from 'three';
 
 const LIGHT_PIXELS = 6;
 const RECT_AREA_LIGHT = 0;
@@ -16,6 +16,8 @@ export class LightsInfoUniformStruct {
 		tex.wrapS = ClampToEdgeWrapping;
 		tex.wrapT = ClampToEdgeWrapping;
 		tex.generateMipmaps = false;
+		tex.minFilter = NearestFilter;
+		tex.magFilter = NearestFilter;
 
 		this.tex = tex;
 		this.count = 0;
@@ -46,7 +48,7 @@ export class LightsInfoUniformStruct {
 		const worldQuaternion = new Quaternion();
 		const eye = new Vector3();
 		const target = new Vector3();
-		const up = new Vector3();
+		const up = new Vector3( 0, 1, 0 );
 
 		for ( let i = 0, l = lights.length; i < l; i ++ ) {
 
@@ -55,6 +57,13 @@ export class LightsInfoUniformStruct {
 			const baseIndex = i * LIGHT_PIXELS * 4;
 			let index = 0;
 
+			// initialize to 0
+			for ( let p = 0; p < LIGHT_PIXELS; p ++ ) {
+
+				floatArray[ baseIndex + p ] = 0;
+
+			}
+
 			// sample 1
 		    // position
 			l.getWorldPosition( v );
@@ -119,7 +128,7 @@ export class LightsInfoUniformStruct {
 
 			} else if ( l.isSpotLight ) {
 
-				const radius = l.radius;
+				const radius = l.radius || 0;
 				eye.setFromMatrixPosition( l.matrixWorld );
 				target.setFromMatrixPosition( l.target.matrixWorld );
 				m.lookAt( eye, target, up );
@@ -149,24 +158,21 @@ export class LightsInfoUniformStruct {
 				// radius
 				floatArray[ baseIndex + ( index ++ ) ] = radius;
 
-				// near
-				floatArray[ baseIndex + ( index ++ ) ] = l.shadow.camera.near;
-
 				// decay
 				floatArray[ baseIndex + ( index ++ ) ] = l.decay;
 
 				// distance
 				floatArray[ baseIndex + ( index ++ ) ] = l.distance;
 
-				// sample 6
 				// coneCos
 				floatArray[ baseIndex + ( index ++ ) ] = Math.cos( l.angle );
 
+				// sample 6
 				// penumbraCos
 				floatArray[ baseIndex + ( index ++ ) ] = Math.cos( l.angle * ( 1 - l.penumbra ) );
 
 				// iesProfile
-				floatArray[ baseIndex + ( index ++ ) ] = iesTextures.indexOf( l.iesTexture );
+				floatArray[ baseIndex + ( index ++ ) ] = l.iesTexture ? iesTextures.indexOf( l.iesTexture ) : - 1;
 
 			} else if ( l.isPointLight ) {
 
@@ -183,7 +189,7 @@ export class LightsInfoUniformStruct {
 				index += 4;
 
 				// sample 5
-				index += 2;
+				index += 1;
 
 				floatArray[ baseIndex + ( index ++ ) ] = l.decay;
 				floatArray[ baseIndex + ( index ++ ) ] = l.distance;

package/src/uniforms/MaterialsTexture.js

@@ -1,4 +1,4 @@
-import { DataTexture, RGBAFormat, ClampToEdgeWrapping, FloatType, FrontSide, BackSide, DoubleSide } from 'three';
+import { DataTexture, RGBAFormat, ClampToEdgeWrapping, FloatType, FrontSide, BackSide, DoubleSide, NearestFilter } from 'three';
 import { reduceTexturesToUniqueSources, getTextureHash } from './utils.js';
 
 const MATERIAL_PIXELS = 45;
@@ -53,6 +53,8 @@ export class MaterialsTexture extends DataTexture {
 		this.type = FloatType;
 		this.wrapS = ClampToEdgeWrapping;
 		this.wrapT = ClampToEdgeWrapping;
+		this.minFilter = NearestFilter;
+		this.magFilter = NearestFilter;
 		this.generateMipmaps = false;
 		this.threeCompatibilityTransforms = false;
 		this.features = new MaterialFeatures();