@gnsx/three 0.184.0

package/examples/jsm/math/ImprovedNoise.js

@@ -0,0 +1,88 @@
+import { MathUtils } from 'three';
+
+const { lerp } = MathUtils;
+
+const _p = [ 151, 160, 137, 91, 90, 15, 131, 13, 201, 95, 96, 53, 194, 233, 7, 225, 140, 36, 103, 30, 69, 142, 8, 99, 37, 240, 21, 10,
+	 23, 190, 6, 148, 247, 120, 234, 75, 0, 26, 197, 62, 94, 252, 219, 203, 117, 35, 11, 32, 57, 177, 33, 88, 237, 149, 56, 87,
+	 174, 20, 125, 136, 171, 168, 68, 175, 74, 165, 71, 134, 139, 48, 27, 166, 77, 146, 158, 231, 83, 111, 229, 122, 60, 211,
+	 133, 230, 220, 105, 92, 41, 55, 46, 245, 40, 244, 102, 143, 54, 65, 25, 63, 161, 1, 216, 80, 73, 209, 76, 132, 187, 208,
+	 89, 18, 169, 200, 196, 135, 130, 116, 188, 159, 86, 164, 100, 109, 198, 173, 186, 3, 64, 52, 217, 226, 250, 124, 123, 5,
+	 202, 38, 147, 118, 126, 255, 82, 85, 212, 207, 206, 59, 227, 47, 16, 58, 17, 182, 189, 28, 42, 223, 183, 170, 213, 119,
+	 248, 152, 2, 44, 154, 163, 70, 221, 153, 101, 155, 167, 43, 172, 9, 129, 22, 39, 253, 19, 98, 108, 110, 79, 113, 224, 232,
+	 178, 185, 112, 104, 218, 246, 97, 228, 251, 34, 242, 193, 238, 210, 144, 12, 191, 179, 162, 241, 81, 51, 145, 235, 249,
+	 14, 239, 107, 49, 192, 214, 31, 181, 199, 106, 157, 184, 84, 204, 176, 115, 121, 50, 45, 127, 4, 150, 254, 138, 236, 205,
+	 93, 222, 114, 67, 29, 24, 72, 243, 141, 128, 195, 78, 66, 215, 61, 156, 180 ];
+
+for ( let i = 0; i < 256; i ++ ) {
+
+	_p[ 256 + i ] = _p[ i ];
+
+}
+
+function fade( t ) {
+
+	return t * t * t * ( t * ( t * 6 - 15 ) + 10 );
+
+}
+
+function grad( hash, x, y, z ) {
+
+	const h = hash & 15;
+	const u = h < 8 ? x : y, v = h < 4 ? y : h == 12 || h == 14 ? x : z;
+	return ( ( h & 1 ) == 0 ? u : - u ) + ( ( h & 2 ) == 0 ? v : - v );
+
+}
+
+/**
+ * A utility class providing a 3D noise function.
+ *
+ * The code is based on [IMPROVED NOISE](https://cs.nyu.edu/~perlin/noise/)
+ * by Ken Perlin, 2002.
+ *
+ * @three_import import { ImprovedNoise } from 'three/addons/math/ImprovedNoise.js';
+ */
+class ImprovedNoise {
+
+	/**
+	 * Returns a noise value for the given parameters.
+	 *
+	 * @param {number} x - The x coordinate.
+	 * @param {number} y - The y coordinate.
+	 * @param {number} z - The z coordinate.
+	 * @return {number} The noise value.
+	 */
+	noise( x, y, z ) {
+
+		const floorX = Math.floor( x ), floorY = Math.floor( y ), floorZ = Math.floor( z );
+
+		const X = floorX & 255, Y = floorY & 255, Z = floorZ & 255;
+
+		x -= floorX;
+		y -= floorY;
+		z -= floorZ;
+
+		const xMinus1 = x - 1, yMinus1 = y - 1, zMinus1 = z - 1;
+
+		const u = fade( x ), v = fade( y ), w = fade( z );
+
+		const A = _p[ X ] + Y, AA = _p[ A ] + Z, AB = _p[ A + 1 ] + Z, B = _p[ X + 1 ] + Y, BA = _p[ B ] + Z, BB = _p[ B + 1 ] + Z;
+
+		return lerp(
+			lerp(
+				lerp( grad( _p[ AA ], x, y, z ), grad( _p[ BA ], xMinus1, y, z ), u ),
+				lerp( grad( _p[ AB ], x, yMinus1, z ), grad( _p[ BB ], xMinus1, yMinus1, z ), u ),
+				v
+			),
+			lerp(
+				lerp( grad( _p[ AA + 1 ], x, y, zMinus1 ), grad( _p[ BA + 1 ], xMinus1, y, zMinus1 ), u ),
+				lerp( grad( _p[ AB + 1 ], x, yMinus1, zMinus1 ), grad( _p[ BB + 1 ], xMinus1, yMinus1, zMinus1 ), u ),
+				v
+			),
+			w
+		);
+
+	}
+
+}
+
+export { ImprovedNoise };

package/examples/jsm/math/Lut.js

@@ -0,0 +1,317 @@
+import {
+	Color,
+	LinearSRGBColorSpace,
+	MathUtils
+} from 'three';
+
+/**
+ * Represents a lookup table for colormaps. It is used to determine the color
+ * values from a range of data values.
+ *
+ * ```js
+ * const lut = new Lut( 'rainbow', 512 );
+ * const color = lut.getColor( 0.5 );
+ * ```
+ *
+ * @three_import import { Lut } from 'three/addons/math/Lut.js';
+ */
+class Lut {
+
+	/**
+	 * Constructs a new Lut.
+	 *
+	 * @param {('rainbow'|'cooltowarm'|'blackbody'|'grayscale')} [colormap='rainbow'] - Sets a colormap from predefined list of colormaps.
+	 * @param {number} [count=32] - Sets the number of colors used to represent the data array.
+	 */
+ 	constructor( colormap, count = 32 ) {
+
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
+		this.isLut = true;
+
+
+		/**
+		 * The lookup table for the selected color map
+		 *
+		 * @type {Array<Color>}
+		 */
+		this.lut = [];
+
+		/**
+		 * The currently selected color map.
+		 *
+		 * @type {Array<Array<number>>}
+		 */
+		this.map = [];
+
+		/**
+		 * The number of colors of the current selected color map.
+		 *
+		 * @type {number}
+		 * @default 32
+		 */
+		this.n = 0;
+
+		/**
+		 * The minimum value to be represented with the lookup table.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
+		this.minV = 0;
+
+		/**
+		 * The maximum value to be represented with the lookup table.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
+		this.maxV = 1;
+
+		this.setColorMap( colormap, count );
+
+	}
+
+	/**
+	 * Sets the given LUT.
+	 *
+	 * @param {Lut} value - The LUT to set.
+	 * @return {Lut} A reference to this LUT.
+	 */
+	set( value ) {
+
+		if ( value.isLut === true ) {
+
+			this.copy( value );
+
+		}
+
+		return this;
+
+	}
+
+	/**
+	 * Sets the minimum value to be represented with this LUT.
+	 *
+	 * @param {number} min - The minimum value to be represented with the lookup table.
+	 * @return {Lut} A reference to this LUT.
+	 */
+	setMin( min ) {
+
+		this.minV = min;
+
+		return this;
+
+	}
+
+	/**
+	 * Sets the maximum value to be represented with this LUT.
+	 *
+	 * @param {number} max - The maximum value to be represented with the lookup table.
+	 * @return {Lut} A reference to this LUT.
+	 */
+	setMax( max ) {
+
+		this.maxV = max;
+
+		return this;
+
+	}
+
+	/**
+	 * Configure the lookup table for the given color map and number of colors.
+	 *
+	 * @param {string} colormap - The name of the color map.
+	 * @param {number} [count=32] - The number of colors.
+	 * @return {Lut} A reference to this LUT.
+	 */
+	setColorMap( colormap, count = 32 ) {
+
+		this.map = ColorMapKeywords[ colormap ] || ColorMapKeywords.rainbow;
+		this.n = count;
+
+		const step = 1.0 / this.n;
+		const minColor = new Color();
+		const maxColor = new Color();
+
+		this.lut.length = 0;
+
+		// sample at 0
+
+		this.lut.push( new Color( this.map[ 0 ][ 1 ] ) );
+
+		// sample at 1/n, ..., (n-1)/n
+
+		for ( let i = 1; i < count; i ++ ) {
+
+			const alpha = i * step;
+
+			for ( let j = 0; j < this.map.length - 1; j ++ ) {
+
+				if ( alpha > this.map[ j ][ 0 ] && alpha <= this.map[ j + 1 ][ 0 ] ) {
+
+					const min = this.map[ j ][ 0 ];
+					const max = this.map[ j + 1 ][ 0 ];
+
+					minColor.setHex( this.map[ j ][ 1 ], LinearSRGBColorSpace );
+					maxColor.setHex( this.map[ j + 1 ][ 1 ], LinearSRGBColorSpace );
+
+					const color = new Color().lerpColors( minColor, maxColor, ( alpha - min ) / ( max - min ) );
+
+					this.lut.push( color );
+
+				}
+
+			}
+
+		}
+
+		// sample at 1
+
+		this.lut.push( new Color( this.map[ this.map.length - 1 ][ 1 ] ) );
+
+		return this;
+
+	}
+
+	/**
+	 * Copies the given lut.
+	 *
+	 * @param {Lut} lut - The LUT to copy.
+	 * @return {Lut} A reference to this LUT.
+	 */
+	copy( lut ) {
+
+		this.lut = lut.lut;
+		this.map = lut.map;
+		this.n = lut.n;
+		this.minV = lut.minV;
+		this.maxV = lut.maxV;
+
+		return this;
+
+	}
+
+	/**
+	 * Returns an instance of Color for the given data value.
+	 *
+	 * @param {number} alpha - The value to lookup.
+	 * @return {Color} The color from the LUT.
+	 */
+	getColor( alpha ) {
+
+		alpha = MathUtils.clamp( alpha, this.minV, this.maxV );
+
+		alpha = ( alpha - this.minV ) / ( this.maxV - this.minV );
+
+		const colorPosition = Math.round( alpha * this.n );
+
+		return this.lut[ colorPosition ];
+
+	}
+
+	/**
+	 * Adds a color map to this Lut instance.
+	 *
+	 * @param {string} name - The name of the color map.
+	 * @param {Array<Array<number>>} arrayOfColors - An array of color values. Each value is an array
+	 * holding a threshold and the actual color value as a hexadecimal number.
+	 * @return {Lut} A reference to this LUT.
+	 */
+	addColorMap( name, arrayOfColors ) {
+
+		ColorMapKeywords[ name ] = arrayOfColors;
+
+		return this;
+
+	}
+
+	/**
+	 * Creates a canvas in order to visualize the lookup table as a texture.
+	 *
+	 * @return {HTMLCanvasElement} The created canvas.
+	 */
+	createCanvas() {
+
+		const canvas = document.createElement( 'canvas' );
+		canvas.width = 1;
+		canvas.height = this.n;
+
+		this.updateCanvas( canvas );
+
+		return canvas;
+
+	}
+
+	/**
+	 * Updates the given canvas with the Lut's data.
+	 *
+	 * @param {HTMLCanvasElement} canvas - The canvas to update.
+	 * @return {HTMLCanvasElement} The updated canvas.
+	 */
+	updateCanvas( canvas ) {
+
+		const ctx = canvas.getContext( '2d', { alpha: false } );
+
+		const imageData = ctx.getImageData( 0, 0, 1, this.n );
+
+		const data = imageData.data;
+
+		let k = 0;
+
+		const step = 1.0 / this.n;
+
+		const minColor = new Color();
+		const maxColor = new Color();
+		const finalColor = new Color();
+
+		for ( let i = 1; i >= 0; i -= step ) {
+
+			for ( let j = this.map.length - 1; j >= 0; j -- ) {
+
+				if ( i < this.map[ j ][ 0 ] && i >= this.map[ j - 1 ][ 0 ] ) {
+
+					const min = this.map[ j - 1 ][ 0 ];
+					const max = this.map[ j ][ 0 ];
+
+					minColor.setHex( this.map[ j - 1 ][ 1 ], LinearSRGBColorSpace );
+					maxColor.setHex( this.map[ j ][ 1 ], LinearSRGBColorSpace );
+
+					finalColor.lerpColors( minColor, maxColor, ( i - min ) / ( max - min ) );
+
+					data[ k * 4 ] = Math.round( finalColor.r * 255 );
+					data[ k * 4 + 1 ] = Math.round( finalColor.g * 255 );
+					data[ k * 4 + 2 ] = Math.round( finalColor.b * 255 );
+					data[ k * 4 + 3 ] = 255;
+
+					k += 1;
+
+				}
+
+			}
+
+		}
+
+		ctx.putImageData( imageData, 0, 0 );
+
+		return canvas;
+
+	}
+
+}
+
+const ColorMapKeywords = {
+
+	'rainbow': [[ 0.0, 0x0000FF ], [ 0.2, 0x00FFFF ], [ 0.5, 0x00FF00 ], [ 0.8, 0xFFFF00 ], [ 1.0, 0xFF0000 ]],
+	'cooltowarm': [[ 0.0, 0x3C4EC2 ], [ 0.2, 0x9BBCFF ], [ 0.5, 0xDCDCDC ], [ 0.8, 0xF6A385 ], [ 1.0, 0xB40426 ]],
+	'blackbody': [[ 0.0, 0x000000 ], [ 0.2, 0x780000 ], [ 0.5, 0xE63200 ], [ 0.8, 0xFFFF00 ], [ 1.0, 0xFFFFFF ]],
+	'grayscale': [[ 0.0, 0x000000 ], [ 0.2, 0x404040 ], [ 0.5, 0x7F7F80 ], [ 0.8, 0xBFBFBF ], [ 1.0, 0xFFFFFF ]]
+
+};
+
+export { Lut, ColorMapKeywords };

package/examples/jsm/math/MeshSurfaceSampler.js

@@ -0,0 +1,315 @@
+import {
+	Triangle,
+	Vector2,
+	Vector3
+} from 'three';
+
+const _face = new Triangle();
+const _color = new Vector3();
+const _uva = new Vector2(), _uvb = new Vector2(), _uvc = new Vector2();
+
+/**
+ * Utility class for sampling weighted random points on the surface of a mesh.
+ *
+ * Building the sampler is a one-time O(n) operation. Once built, any number of
+ * random samples may be selected in O(logn) time. Memory usage is O(n).
+ *
+ * References:
+ * - {@link http://www.joesfer.com/?p=84}
+ * - {@link https://stackoverflow.com/a/4322940/1314762}
+ *
+ * ```js
+ * const sampler = new MeshSurfaceSampler( surfaceMesh )
+ * 	.setWeightAttribute( 'color' )
+ * 	.build();
+ *
+ * const mesh = new THREE.InstancedMesh( sampleGeometry, sampleMaterial, 100 );
+ *
+ * const position = new THREE.Vector3();
+ * const matrix = new THREE.Matrix4();
+ *
+ * // Sample randomly from the surface, creating an instance of the sample geometry at each sample point.
+ *
+ * for ( let i = 0; i < 100; i ++ ) {
+ *
+ * 	sampler.sample( position );
+ * 	matrix.makeTranslation( position.x, position.y, position.z );
+ * 	mesh.setMatrixAt( i, matrix );
+ *
+ * }
+ *
+ * scene.add( mesh );
+ * ```
+ *
+ * @three_import import { MeshSurfaceSampler } from 'three/addons/math/MeshSurfaceSampler.js';
+ */
+class MeshSurfaceSampler {
+
+	/**
+	 * Constructs a mesh surface sampler.
+	 *
+	 * @param {Mesh} mesh - Surface mesh from which to sample.
+	 */
+	constructor( mesh ) {
+
+		this.geometry = mesh.geometry;
+		this.randomFunction = Math.random;
+
+		this.indexAttribute = this.geometry.index;
+		this.positionAttribute = this.geometry.getAttribute( 'position' );
+		this.normalAttribute = this.geometry.getAttribute( 'normal' );
+		this.colorAttribute = this.geometry.getAttribute( 'color' );
+		this.uvAttribute = this.geometry.getAttribute( 'uv' );
+		this.weightAttribute = null;
+
+		this.distribution = null;
+
+	}
+
+	/**
+	 * Specifies a vertex attribute to be used as a weight when sampling from the surface.
+	 * Faces with higher weights are more likely to be sampled, and those with weights of
+	 * zero will not be sampled at all. For vector attributes, only .x is used in sampling.
+	 *
+	 * If no weight attribute is selected, sampling is randomly distributed by area.
+	 *
+	 * @param {string} name - The attribute name.
+	 * @return {MeshSurfaceSampler} A reference to this sampler.
+	 */
+	setWeightAttribute( name ) {
+
+		this.weightAttribute = name ? this.geometry.getAttribute( name ) : null;
+
+		return this;
+
+	}
+
+	/**
+	 * Processes the input geometry and prepares to return samples. Any configuration of the
+	 * geometry or sampler must occur before this method is called. Time complexity is O(n)
+	 * for a surface with n faces.
+	 *
+	 * @return {MeshSurfaceSampler} A reference to this sampler.
+	 */
+	build() {
+
+		const indexAttribute = this.indexAttribute;
+		const positionAttribute = this.positionAttribute;
+		const weightAttribute = this.weightAttribute;
+
+		const totalFaces = indexAttribute ? ( indexAttribute.count / 3 ) : ( positionAttribute.count / 3 );
+		const faceWeights = new Float32Array( totalFaces );
+
+		// Accumulate weights for each mesh face.
+
+		for ( let i = 0; i < totalFaces; i ++ ) {
+
+			let faceWeight = 1;
+
+			let i0 = 3 * i;
+			let i1 = 3 * i + 1;
+			let i2 = 3 * i + 2;
+
+			if ( indexAttribute ) {
+
+				i0 = indexAttribute.getX( i0 );
+				i1 = indexAttribute.getX( i1 );
+				i2 = indexAttribute.getX( i2 );
+
+			}
+
+			if ( weightAttribute ) {
+
+				faceWeight = weightAttribute.getX( i0 )
+					+ weightAttribute.getX( i1 )
+					+ weightAttribute.getX( i2 );
+
+			}
+
+			_face.a.fromBufferAttribute( positionAttribute, i0 );
+			_face.b.fromBufferAttribute( positionAttribute, i1 );
+			_face.c.fromBufferAttribute( positionAttribute, i2 );
+			faceWeight *= _face.getArea();
+
+			faceWeights[ i ] = faceWeight;
+
+		}
+
+		// Store cumulative total face weights in an array, where weight index
+		// corresponds to face index.
+
+		const distribution = new Float32Array( totalFaces );
+		let cumulativeTotal = 0;
+
+		for ( let i = 0; i < totalFaces; i ++ ) {
+
+			cumulativeTotal += faceWeights[ i ];
+			distribution[ i ] = cumulativeTotal;
+
+		}
+
+		this.distribution = distribution;
+		return this;
+
+	}
+
+	/**
+	 * Allows to set a custom random number generator. Default is `Math.random()`.
+	 *
+	 * @param {Function} randomFunction - A random number generator.
+	 * @return {MeshSurfaceSampler} A reference to this sampler.
+	 */
+	setRandomGenerator( randomFunction ) {
+
+		this.randomFunction = randomFunction;
+		return this;
+
+	}
+
+	/**
+	 * Selects a random point on the surface of the input geometry, returning the
+	 * position and optionally the normal vector, color and UV Coordinate at that point.
+	 * Time complexity is O(log n) for a surface with n faces.
+	 *
+	 * @param {Vector3} targetPosition - The target object holding the sampled position.
+	 * @param {Vector3} targetNormal - The target object holding the sampled normal.
+	 * @param {Color} targetColor - The target object holding the sampled color.
+	 * @param {Vector2} targetUV -  The target object holding the sampled uv coordinates.
+	 * @return {MeshSurfaceSampler} A reference to this sampler.
+	 */
+	sample( targetPosition, targetNormal, targetColor, targetUV ) {
+
+		const faceIndex = this._sampleFaceIndex();
+		return this._sampleFace( faceIndex, targetPosition, targetNormal, targetColor, targetUV );
+
+	}
+
+	// private
+
+	_sampleFaceIndex() {
+
+		const cumulativeTotal = this.distribution[ this.distribution.length - 1 ];
+		return this._binarySearch( this.randomFunction() * cumulativeTotal );
+
+	}
+
+	_binarySearch( x ) {
+
+		const dist = this.distribution;
+		let start = 0;
+		let end = dist.length - 1;
+
+		let index = - 1;
+
+		while ( start <= end ) {
+
+			const mid = Math.ceil( ( start + end ) / 2 );
+
+			if ( mid === 0 || dist[ mid - 1 ] <= x && dist[ mid ] > x ) {
+
+				index = mid;
+
+				break;
+
+			} else if ( x < dist[ mid ] ) {
+
+				end = mid - 1;
+
+			} else {
+
+				start = mid + 1;
+
+			}
+
+		}
+
+		return index;
+
+	}
+
+	_sampleFace( faceIndex, targetPosition, targetNormal, targetColor, targetUV ) {
+
+		let u = this.randomFunction();
+		let v = this.randomFunction();
+
+		if ( u + v > 1 ) {
+
+			u = 1 - u;
+			v = 1 - v;
+
+		}
+
+		// get the vertex attribute indices
+		const indexAttribute = this.indexAttribute;
+		let i0 = faceIndex * 3;
+		let i1 = faceIndex * 3 + 1;
+		let i2 = faceIndex * 3 + 2;
+		if ( indexAttribute ) {
+
+			i0 = indexAttribute.getX( i0 );
+			i1 = indexAttribute.getX( i1 );
+			i2 = indexAttribute.getX( i2 );
+
+		}
+
+		_face.a.fromBufferAttribute( this.positionAttribute, i0 );
+		_face.b.fromBufferAttribute( this.positionAttribute, i1 );
+		_face.c.fromBufferAttribute( this.positionAttribute, i2 );
+
+		targetPosition
+			.set( 0, 0, 0 )
+			.addScaledVector( _face.a, u )
+			.addScaledVector( _face.b, v )
+			.addScaledVector( _face.c, 1 - ( u + v ) );
+
+		if ( targetNormal !== undefined ) {
+
+			if ( this.normalAttribute !== undefined ) {
+
+				_face.a.fromBufferAttribute( this.normalAttribute, i0 );
+				_face.b.fromBufferAttribute( this.normalAttribute, i1 );
+				_face.c.fromBufferAttribute( this.normalAttribute, i2 );
+				targetNormal.set( 0, 0, 0 ).addScaledVector( _face.a, u ).addScaledVector( _face.b, v ).addScaledVector( _face.c, 1 - ( u + v ) ).normalize();
+
+			} else {
+
+				_face.getNormal( targetNormal );
+
+			}
+
+		}
+
+		if ( targetColor !== undefined && this.colorAttribute !== undefined ) {
+
+			_face.a.fromBufferAttribute( this.colorAttribute, i0 );
+			_face.b.fromBufferAttribute( this.colorAttribute, i1 );
+			_face.c.fromBufferAttribute( this.colorAttribute, i2 );
+
+			_color
+				.set( 0, 0, 0 )
+				.addScaledVector( _face.a, u )
+				.addScaledVector( _face.b, v )
+				.addScaledVector( _face.c, 1 - ( u + v ) );
+
+			targetColor.r = _color.x;
+			targetColor.g = _color.y;
+			targetColor.b = _color.z;
+
+		}
+
+		if ( targetUV !== undefined && this.uvAttribute !== undefined ) {
+
+			_uva.fromBufferAttribute( this.uvAttribute, i0 );
+			_uvb.fromBufferAttribute( this.uvAttribute, i1 );
+			_uvc.fromBufferAttribute( this.uvAttribute, i2 );
+			targetUV.set( 0, 0 ).addScaledVector( _uva, u ).addScaledVector( _uvb, v ).addScaledVector( _uvc, 1 - ( u + v ) );
+
+		}
+
+		return this;
+
+	}
+
+}
+
+export { MeshSurfaceSampler };