浏览代码

JSM: Add module and TS files for math files.

Mugen87 6 年之前
父节点
当前提交
053f81d7d5

+ 3 - 0
docs/manual/en/introduction/Import-via-modules.html

@@ -155,6 +155,9 @@
 				</li>
 				<li>math
 					<ul>
+						<li>ColorConverter</li>
+						<li>ImprovedNoise</li>
+						<li>Lut</li>
 						<li>SimplexNoise</li>
 					</ul>
 				</li>

+ 0 - 15
examples/js/math/Lut.js

@@ -10,20 +10,6 @@ THREE.Lut = function ( colormap, numberofcolors ) {
 
 };
 
-var defaultLabelParameters = {
-	fontsize: 24,
-	fontface: 'Arial',
-	title: '',
-	um: '',
-	ticks: 0,
-	decimal: 2,
-	notation: 'standard'
-};
-
-var defaultBackgroundColor = { r: 255, g: 100, b: 100, a: 0.8 };
-var defaultBorderColor = { r: 255, g: 0, b: 0, a: 1.0 };
-var defaultBorderThickness = 4;
-
 THREE.Lut.prototype = {
 
 	constructor: THREE.Lut,
@@ -189,7 +175,6 @@ THREE.Lut.prototype = {
 	}
 };
 
-
 THREE.ColorMapKeywords = {
 
 	"rainbow": [[ 0.0, 0x0000FF ], [ 0.2, 0x00FFFF ], [ 0.5, 0x00FF00 ], [ 0.8, 0xFFFF00 ], [ 1.0, 0xFF0000 ]],

+ 25 - 0
examples/jsm/math/ColorConverter.d.ts

@@ -0,0 +1,25 @@
+import {
+  Color
+} from '../../../src/Three';
+
+export interface HSL {
+  h: number;
+  s: number;
+  l: number;
+}
+
+export interface CMYK {
+  c: number;
+  m: number;
+  y: number;
+  k: number;
+}
+
+export namespace ColorConverter {
+
+  export function setHSV(color: Color, h: number, s: number, v: number): Color;
+  export function getHSV(color: Color, target: HSL): HSL;
+  export function setCMYK(color: Color, c: number, m: number, y: number, k: number): Color;
+  export function getCMYK(color: Color, target: CMYK): CMYK;
+
+}

+ 94 - 0
examples/jsm/math/ColorConverter.js

@@ -0,0 +1,94 @@
+/**
+ * @author bhouston / http://exocortex.com/
+ * @author zz85 / http://github.com/zz85
+ */
+
+import {
+	Math as _Math
+} from "../../../build/three.module.js";
+
+var ColorConverter = {
+
+	setHSV: function ( color, h, s, v ) {
+
+		// https://gist.github.com/xpansive/1337890#file-index-js
+
+		h = _Math.euclideanModulo( h, 1 );
+		s = _Math.clamp( s, 0, 1 );
+		v = _Math.clamp( v, 0, 1 );
+
+		return color.setHSL( h, ( s * v ) / ( ( h = ( 2 - s ) * v ) < 1 ? h : ( 2 - h ) ), h * 0.5 );
+
+	},
+
+	getHSV: function () {
+
+		var hsl = {};
+
+		return function getHSV( color, target ) {
+
+			if ( target === undefined ) {
+
+				console.warn( 'THREE.ColorConverter: .getHSV() target is now required' );
+				target = { h: 0, s: 0, l: 0 };
+
+			}
+
+			color.getHSL( hsl );
+
+			// based on https://gist.github.com/xpansive/1337890#file-index-js
+			hsl.s *= ( hsl.l < 0.5 ) ? hsl.l : ( 1 - hsl.l );
+
+			target.h = hsl.h;
+			target.s = 2 * hsl.s / ( hsl.l + hsl.s );
+			target.v = hsl.l + hsl.s;
+
+			return target;
+
+		};
+
+	}(),
+
+	// where c, m, y, k is between 0 and 1
+
+	setCMYK: function ( color, c, m, y, k ) {
+
+		var r = ( 1 - c ) * ( 1 - k );
+		var g = ( 1 - m ) * ( 1 - k );
+		var b = ( 1 - y ) * ( 1 - k );
+
+		return color.setRGB( r, g, b );
+
+	},
+
+	getCMYK: function ( color, target ) {
+
+		if ( target === undefined ) {
+
+			console.warn( 'THREE.ColorConverter: .getCMYK() target is now required' );
+			target = { c: 0, m: 0, y: 0, k: 0 };
+
+		}
+
+		var r = color.r;
+		var g = color.g;
+		var b = color.b;
+
+		var k = 1 - Math.max( r, g, b );
+		var c = ( 1 - r - k ) / ( 1 - k );
+		var m = ( 1 - g - k ) / ( 1 - k );
+		var y = ( 1 - b - k ) / ( 1 - k );
+
+		target.c = c;
+		target.m = m;
+		target.y = y;
+		target.k = k;
+
+		return target;
+
+	}
+
+
+};
+
+export { ColorConverter };

+ 4 - 0
examples/jsm/math/ImprovedNoise.d.ts

@@ -0,0 +1,4 @@
+export class ImprovedNoise {
+  constructor();
+  noise(x: number, y: number, z: number): number;
+}

+ 74 - 0
examples/jsm/math/ImprovedNoise.js

@@ -0,0 +1,74 @@
+// http://mrl.nyu.edu/~perlin/noise/
+
+var ImprovedNoise = function () {
+
+	var 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 ( var i = 0; i < 256; i ++ ) {
+
+		p[ 256 + i ] = p[ i ];
+
+	}
+
+	function fade( t ) {
+
+		return t * t * t * ( t * ( t * 6 - 15 ) + 10 );
+
+	}
+
+	function lerp( t, a, b ) {
+
+		return a + t * ( b - a );
+
+	}
+
+	function grad( hash, x, y, z ) {
+
+		var h = hash & 15;
+		var 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 );
+
+	}
+
+	return {
+
+		noise: function ( x, y, z ) {
+
+			var floorX = Math.floor( x ), floorY = Math.floor( y ), floorZ = Math.floor( z );
+
+			var X = floorX & 255, Y = floorY & 255, Z = floorZ & 255;
+
+			x -= floorX;
+			y -= floorY;
+			z -= floorZ;
+
+			var xMinus1 = x - 1, yMinus1 = y - 1, zMinus1 = z - 1;
+
+			var u = fade( x ), v = fade( y ), w = fade( z );
+
+			var 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( w, lerp( v, lerp( u, grad( p[ AA ], x, y, z ),
+				grad( p[ BA ], xMinus1, y, z ) ),
+			lerp( u, grad( p[ AB ], x, yMinus1, z ),
+				grad( p[ BB ], xMinus1, yMinus1, z ) ) ),
+			lerp( v, lerp( u, grad( p[ AA + 1 ], x, y, zMinus1 ),
+				grad( p[ BA + 1 ], xMinus1, y, z - 1 ) ),
+			lerp( u, grad( p[ AB + 1 ], x, yMinus1, zMinus1 ),
+				grad( p[ BB + 1 ], xMinus1, yMinus1, zMinus1 ) ) ) );
+
+		}
+	};
+
+};
+
+export { ImprovedNoise };

+ 29 - 0
examples/jsm/math/Lut.d.ts

@@ -0,0 +1,29 @@
+import {
+  Color
+} from '../../../src/Three';
+
+export class Lut {
+  constructor(colormap?: string, numberofcolors?: number);
+  lut: Color[];
+  map: object[];
+  n: number;
+  minV: number;
+  maxV: number;
+
+  set(value: Lut): this;
+  setMin(min: number): this;
+  setMax(max: number): this;
+  setColorMap(colormap?: string, numberofcolors?: number): this;
+  copy(lut: Lut): this;
+  getColor(alpha: number): Color;
+  addColorMap(colormapName: string, arrayOfColors: number[][]): void;
+  createCanvas(): HTMLCanvasElement;
+  updateCanvas(canvas: HTMLCanvasElement): HTMLCanvasElement;
+}
+
+export interface ColorMapKeywords {
+  rainbow: number[][];
+  cooltowarm: number[][];
+  blackbody: number[][];
+  grayscale: number[][];
+}

+ 191 - 0
examples/jsm/math/Lut.js

@@ -0,0 +1,191 @@
+/**
+ * @author daron1337 / http://daron1337.github.io/
+ */
+
+import {
+	Color
+} from "../../../build/three.module.js";
+
+var Lut = function ( colormap, numberofcolors ) {
+
+	this.lut = [];
+	this.setColorMap( colormap, numberofcolors );
+	return this;
+
+};
+
+Lut.prototype = {
+
+	constructor: Lut,
+
+	lut: [], map: [], n: 256, minV: 0, maxV: 1,
+
+	set: function ( value ) {
+
+		if ( value instanceof Lut ) {
+
+			this.copy( value );
+
+		}
+
+		return this;
+
+	},
+
+	setMin: function ( min ) {
+
+		this.minV = min;
+
+		return this;
+
+	},
+
+	setMax: function ( max ) {
+
+		this.maxV = max;
+
+		return this;
+
+	},
+
+	setColorMap: function ( colormap, numberofcolors ) {
+
+		this.map = ColorMapKeywords[ colormap ] || ColorMapKeywords.rainbow;
+		this.n = numberofcolors || 32;
+
+		var step = 1.0 / this.n;
+
+		this.lut.length = 0;
+		for ( var i = 0; i <= 1; i += step ) {
+
+			for ( var j = 0; j < this.map.length - 1; j ++ ) {
+
+				if ( i >= this.map[ j ][ 0 ] && i < this.map[ j + 1 ][ 0 ] ) {
+
+					var min = this.map[ j ][ 0 ];
+					var max = this.map[ j + 1 ][ 0 ];
+
+					var minColor = new Color( this.map[ j ][ 1 ] );
+					var maxColor = new Color( this.map[ j + 1 ][ 1 ] );
+
+					var color = minColor.lerp( maxColor, ( i - min ) / ( max - min ) );
+
+					this.lut.push( color );
+
+				}
+
+			}
+
+		}
+
+		return this;
+
+	},
+
+	copy: function ( lut ) {
+
+		this.lut = lut.lut;
+		this.map = lut.map;
+		this.n = lut.n;
+		this.minV = lut.minV;
+		this.maxV = lut.maxV;
+
+		return this;
+
+	},
+
+	getColor: function ( alpha ) {
+
+		if ( alpha <= this.minV ) {
+
+			alpha = this.minV;
+
+		} else if ( alpha >= this.maxV ) {
+
+			alpha = this.maxV;
+
+		}
+
+		alpha = ( alpha - this.minV ) / ( this.maxV - this.minV );
+
+		var colorPosition = Math.round( alpha * this.n );
+		colorPosition == this.n ? colorPosition -= 1 : colorPosition;
+
+		return this.lut[ colorPosition ];
+
+	},
+
+	addColorMap: function ( colormapName, arrayOfColors ) {
+
+		ColorMapKeywords[ colormapName ] = arrayOfColors;
+
+	},
+
+	createCanvas: function () {
+
+		var canvas = document.createElement( 'canvas' );
+		canvas.width = 1;
+		canvas.height = this.n;
+
+		this.updateCanvas( canvas );
+
+		return canvas;
+
+	},
+
+	updateCanvas: function ( canvas ) {
+
+		var ctx = canvas.getContext( '2d', { alpha: false } );
+
+		var imageData = ctx.getImageData( 0, 0, 1, this.n );
+
+		var data = imageData.data;
+
+		var k = 0;
+
+		var step = 1.0 / this.n;
+
+		for ( var i = 1; i >= 0; i -= step ) {
+
+			for ( var j = this.map.length - 1; j >= 0; j -- ) {
+
+				if ( i < this.map[ j ][ 0 ] && i >= this.map[ j - 1 ][ 0 ] ) {
+
+					var min = this.map[ j - 1 ][ 0 ];
+					var max = this.map[ j ][ 0 ];
+
+					var minColor = new Color( this.map[ j - 1 ][ 1 ] );
+					var maxColor = new Color( this.map[ j ][ 1 ] );
+
+					var color = minColor.lerp( maxColor, ( i - min ) / ( max - min ) );
+
+					data[ k * 4 ] = Math.round( color.r * 255 );
+					data[ k * 4 + 1 ] = Math.round( color.g * 255 );
+					data[ k * 4 + 2 ] = Math.round( color.b * 255 );
+					data[ k * 4 + 3 ] = 255;
+
+					k += 1;
+
+				}
+
+			}
+
+		}
+
+		ctx.putImageData( imageData, 0, 0 );
+
+		return canvas;
+
+	}
+};
+
+var 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 };

+ 3 - 0
utils/modularize.js

@@ -68,6 +68,9 @@ var files = [
 	{ path: 'loaders/TGALoader.js', dependencies: [], ignoreList: [] },
 	{ path: 'loaders/VRMLLoader.js', dependencies: [], ignoreList: [] },
 
+	{ path: 'math/ColorConverter.js', dependencies: [], ignoreList: [] },
+	{ path: 'math/ImprovedNoise.js', dependencies: [], ignoreList: [] },
+	{ path: 'math/Lut.js', dependencies: [], ignoreList: [] },
 	{ path: 'math/SimplexNoise.js', dependencies: [], ignoreList: [] },
 
 	{ path: 'objects/Lensflare.js', dependencies: [], ignoreList: [] },