LUT: Clean up

examples/js/math/Lut.js

@@ -114,7 +114,7 @@ THREE.Lut.prototype = {
 
 		alpha = ( alpha - this.minV ) / ( this.maxV - this.minV );
 
-		var colorPosition = Math.round ( alpha * this.n );
+		var colorPosition = Math.round( alpha * this.n );
 		colorPosition == this.n ? colorPosition -= 1 : colorPosition;
 
 		return this.lut[ colorPosition ];
@@ -139,7 +139,7 @@ THREE.Lut.prototype = {
 
 		this.legend.layout = parameters.hasOwnProperty( 'layout' ) ? parameters[ 'layout' ] : 'vertical';
 
-		this.legend.position = parameters.hasOwnProperty( 'position' ) ? parameters[ 'position' ] : { 'x': 21.5, 'y': 8, 'z': 5 };
+		this.legend.position = parameters.hasOwnProperty( 'position' ) ? parameters[ 'position' ] : { 'x': 4, 'y': 0, 'z': 0 };
 
 		this.legend.dimensions = parameters.hasOwnProperty( 'dimensions' ) ? parameters[ 'dimensions' ] : { 'width': 0.5, 'height': 3 };
 
@@ -152,7 +152,7 @@ THREE.Lut.prototype = {
 
 		this.legend.ctx = this.legend.canvas.getContext( '2d' );
 
-		this.legend.canvas.setAttribute( 'width',  1 );
+		this.legend.canvas.setAttribute( 'width', 1 );
 		this.legend.canvas.setAttribute( 'height', this.n );
 
 		this.legend.texture = new THREE.Texture( this.legend.canvas );
@@ -171,7 +171,7 @@ THREE.Lut.prototype = {
 
 			for ( var j = this.map.length - 1; j >= 0; j -- ) {
 
-				if ( i < this.map[ j ][ 0 ] && i >= this.map[ j - 1 ][ 0 ]  ) {
+				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 ];
@@ -198,7 +198,7 @@ THREE.Lut.prototype = {
 		this.legend.texture.needsUpdate = true;
 
 		this.legend.legendGeometry = new THREE.PlaneBufferGeometry( this.legend.dimensions.width, this.legend.dimensions.height );
-		this.legend.legendMaterial = new THREE.MeshBasicMaterial( { map : this.legend.texture, side : THREE.DoubleSide } );
+		this.legend.legendMaterial = new THREE.MeshBasicMaterial( { map: this.legend.texture, side: THREE.DoubleSide } );
 
 		this.legend.mesh = new THREE.Mesh( this.legend.legendGeometry, this.legend.legendMaterial );
 
@@ -305,7 +305,7 @@ THREE.Lut.prototype = {
 		this.legend.labels.notation = parameters.hasOwnProperty( 'notation' ) ? parameters[ 'notation' ] : 'standard';
 
 		var backgroundColor = { r: 255, g: 100, b: 100, a: 0.8 };
-		var borderColor =  { r: 255, g: 0, b: 0, a: 1.0 };
+		var borderColor = { r: 255, g: 0, b: 0, a: 1.0 };
 		var borderThickness = 4;
 
 		var canvasTitle = document.createElement( 'canvas' );
@@ -313,10 +313,7 @@ THREE.Lut.prototype = {
 
 		contextTitle.font = 'Normal ' + this.legend.labels.fontsize * 1.2 + 'px ' + this.legend.labels.fontface;
 
-		var metrics = contextTitle.measureText( this.legend.labels.title.toString() + this.legend.labels.um.toString() );
-		var textWidth = metrics.width;
-
-		contextTitle.fillStyle   = 'rgba(' + backgroundColor.r + ',' + backgroundColor.g + ',' + backgroundColor.b + ',' + backgroundColor.a + ')';
+		contextTitle.fillStyle = 'rgba(' + backgroundColor.r + ',' + backgroundColor.g + ',' + backgroundColor.b + ',' + backgroundColor.a + ')';
 
 		contextTitle.strokeStyle = 'rgba(' + borderColor.r + ',' + borderColor.g + ',' + borderColor.b + ',' + borderColor.a + ')';
 
@@ -362,17 +359,17 @@ THREE.Lut.prototype = {
 			if ( this.legend.layout == 'horizontal' ) {
 
 				var topPositionX = this.legend.position.x + ( this.legend.dimensions.height * 0.75 );
-				var bottomPositionX = this.legend.position.x - ( this.legend.dimensions.width * 1.2  ) ;
+				var bottomPositionX = this.legend.position.x - ( this.legend.dimensions.width * 1.2 );
 
 			}
 
 			for ( var i = 0; i < this.legend.labels.ticks; i ++ ) {
 
-				var value = ( this.maxV - this.minV ) / ( this.legend.labels.ticks - 1  ) * i + this.minV;
+				var value = ( this.maxV - this.minV ) / ( this.legend.labels.ticks - 1 ) * i + this.minV;
 
 				if ( callback ) {
 
-					value = callback ( value );
+					value = callback( value );
 
 				} else {
 
@@ -394,9 +391,8 @@ THREE.Lut.prototype = {
 				contextTick.font = 'Normal ' + this.legend.labels.fontsize + 'px ' + this.legend.labels.fontface;
 
 				var metrics = contextTick.measureText( value.toString() );
-				var textWidth = metrics.width;
 
-				contextTick.fillStyle   = 'rgba(' + backgroundColor.r + ',' + backgroundColor.g + ',' + backgroundColor.b + ',' + backgroundColor.a + ')';
+				contextTick.fillStyle = 'rgba(' + backgroundColor.r + ',' + backgroundColor.g + ',' + backgroundColor.b + ',' + backgroundColor.a + ')';
 
 				contextTick.strokeStyle = 'rgba(' + borderColor.r + ',' + borderColor.g + ',' + borderColor.b + ',' + borderColor.a + ')';
 
@@ -458,9 +454,9 @@ THREE.Lut.prototype = {
 
 					var linePosition = ( this.legend.position.y - ( this.legend.dimensions.height * 0.5 ) + 0.01 ) + ( this.legend.dimensions.height ) * ( ( value - this.minV ) / ( this.maxV - this.minV ) * 0.99 );
 
-					points.push( new THREE.Vector3( this.legend.position.x + this.legend.dimensions.width * 0.55, linePosition, this.legend.position.z  ) );
+					points.push( new THREE.Vector3( this.legend.position.x + this.legend.dimensions.width * 0.55, linePosition, this.legend.position.z ) );
 
-					points.push( new THREE.Vector3( this.legend.position.x + this.legend.dimensions.width * 0.7, linePosition, this.legend.position.z  ) );
+					points.push( new THREE.Vector3( this.legend.position.x + this.legend.dimensions.width * 0.7, linePosition, this.legend.position.z ) );
 
 				}
 
@@ -468,9 +464,9 @@ THREE.Lut.prototype = {
 
 					var linePosition = ( this.legend.position.x - ( this.legend.dimensions.height * 0.5 ) + 0.01 ) + ( this.legend.dimensions.height ) * ( ( value - this.minV ) / ( this.maxV - this.minV ) * 0.99 );
 
-					points.push( new THREE.Vector3( linePosition, this.legend.position.y - this.legend.dimensions.width * 0.55, this.legend.position.z  ) );
+					points.push( new THREE.Vector3( linePosition, this.legend.position.y - this.legend.dimensions.width * 0.55, this.legend.position.z ) );
 
-					points.push( new THREE.Vector3( linePosition, this.legend.position.y - this.legend.dimensions.width * 0.7, this.legend.position.z  ) );
+					points.push( new THREE.Vector3( linePosition, this.legend.position.y - this.legend.dimensions.width * 0.7, this.legend.position.z ) );
 
 				}
 
@@ -485,7 +481,7 @@ THREE.Lut.prototype = {
 
 		}
 
-		return { 'title': spriteTitle,  'ticks': ticks, 'lines': lines };
+		return { 'title': spriteTitle, 'ticks': ticks, 'lines': lines };
 
 	}
 
@@ -494,9 +490,9 @@ THREE.Lut.prototype = {
 
 THREE.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' ] ]
+	"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' ]]
 
 };

examples/webgl_geometry_colors_lookuptable.html

@@ -52,16 +52,12 @@
 
 			var camera, scene, renderer, lut, legendLayout;
 
-			var axis;
-
 			var mesh, material;
 
 			var colorMap;
 			var numberOfColors;
 
 			var loader = new THREE.BufferGeometryLoader();
-			var center = new THREE.Vector3();
-			var rotWorldMatrix = new THREE.Matrix4();
 
 			init();
 			animate();
@@ -75,7 +71,8 @@
 				scene.background = new THREE.Color( 0xffffff );
 
 				// CAMERA
-				camera = new THREE.PerspectiveCamera( 20, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 100 );
+				camera.position.set( 0, 0, 10 );
 
 				stats = new Stats();
 				container.appendChild( stats.dom );
@@ -97,8 +94,6 @@
 
 				loadModel( colorMap, numberOfColors, legendLayout );
 
-				camera.position.set( 17, 9, 32 );
-
 				var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.7 );
 				directionalLight.position.set( 17, 9, 30 );
 				scene.add( directionalLight );
@@ -134,7 +129,7 @@
 
 			function render() {
 
-				if ( axis ) mesh.rotateOnAxis( axis, Math.PI / 180 );
+				if ( mesh !== undefined ) mesh.rotation.y += 0.01;
 
 				renderer.render( scene, camera );
 
@@ -144,8 +139,8 @@
 
 				loader.load( 'models/json/pressure.json', function( geometry ) {
 
+					geometry.center();
 					geometry.computeVertexNormals();
-					geometry.normalizeNormals();
 
 					var lutColors = [];
 
@@ -179,17 +174,6 @@
 
 					mesh = new THREE.Mesh( geometry, material );
 
-					geometry.computeBoundingBox();
-					var boundingBox = geometry.boundingBox;
-					boundingBox.getCenter( center );
-
-					if ( axis === undefined ) {
-
-						axis = center.clone();
-						axis.normalize();
-
-					}
-
 					scene.add( mesh );
 
 					if ( legendLayout ) {
@@ -198,7 +182,7 @@
 
 						if ( legendLayout === 'horizontal' ) {
 
-							legend = lut.setLegendOn( { 'layout':'horizontal', 'position': { 'x': 21, 'y': 6, 'z': 5 } } );
+							legend = lut.setLegendOn( { 'layout':'horizontal', 'position': { 'x': 4, 'y': 0, 'z': 0 } } );
 
 						} else {