webglFramework/Thirdparty/three.js-master/examples/js/utils/ImageUtils.js

   1 /**
   2  * @author alteredq / http://alteredqualia.com/
   3  * @author mrdoob / http://mrdoob.com/
   4  * @author Daosheng Mu / https://github.com/DaoshengMu/
   5  */
   6
   7 THREE.ImageUtils = {
   8
   9         getNormalMap: function ( image, depth ) {
  10
  11                 // Adapted from http://www.paulbrunt.co.uk/lab/heightnormal/
  12
  13                 function cross( a, b ) {
  14
  15                         return [ a[ 1 ] * b[ 2 ] - a[ 2 ] * b[ 1 ], a[ 2 ] * b[ 0 ] - a[ 0 ] * b[ 2 ], a[ 0 ] * b[ 1 ] - a[ 1 ] * b[ 0 ] ];
  16
  17                 }
  18
  19                 function subtract( a, b ) {
  20
  21                         return [ a[ 0 ] - b[ 0 ], a[ 1 ] - b[ 1 ], a[ 2 ] - b[ 2 ] ];
  22
  23                 }
  24
  25                 function normalize( a ) {
  26
  27                         var l = Math.sqrt( a[ 0 ] * a[ 0 ] + a[ 1 ] * a[ 1 ] + a[ 2 ] * a[ 2 ] );
  28                         return [ a[ 0 ] / l, a[ 1 ] / l, a[ 2 ] / l ];
  29
  30                 }
  31
  32                 depth = depth | 1;
  33
  34                 var width = image.width;
  35                 var height = image.height;
  36
  37                 var canvas = document.createElement( 'canvas' );
  38                 canvas.width = width;
  39                 canvas.height = height;
  40
  41                 var context = canvas.getContext( '2d' );
  42                 context.drawImage( image, 0, 0 );
  43
  44                 var data = context.getImageData( 0, 0, width, height ).data;
  45                 var imageData = context.createImageData( width, height );
  46                 var output = imageData.data;
  47
  48                 for ( var x = 0; x < width; x ++ ) {
  49
  50                         for ( var y = 0; y < height; y ++ ) {
  51
  52                                 var ly = y - 1 < 0 ? 0 : y - 1;
  53                                 var uy = y + 1 > height - 1 ? height - 1 : y + 1;
  54                                 var lx = x - 1 < 0 ? 0 : x - 1;
  55                                 var ux = x + 1 > width - 1 ? width - 1 : x + 1;
  56
  57                                 var points = [];
  58                                 var origin = [ 0, 0, data[ ( y * width + x ) * 4 ] / 255 * depth ];
  59                                 points.push( [ - 1, 0, data[ ( y * width + lx ) * 4 ] / 255 * depth ] );
  60                                 points.push( [ - 1, - 1, data[ ( ly * width + lx ) * 4 ] / 255 * depth ] );
  61                                 points.push( [ 0, - 1, data[ ( ly * width + x ) * 4 ] / 255 * depth ] );
  62                                 points.push( [ 1, - 1, data[ ( ly * width + ux ) * 4 ] / 255 * depth ] );
  63                                 points.push( [ 1, 0, data[ ( y * width + ux ) * 4 ] / 255 * depth ] );
  64                                 points.push( [ 1, 1, data[ ( uy * width + ux ) * 4 ] / 255 * depth ] );
  65                                 points.push( [ 0, 1, data[ ( uy * width + x ) * 4 ] / 255 * depth ] );
  66                                 points.push( [ - 1, 1, data[ ( uy * width + lx ) * 4 ] / 255 * depth ] );
  67
  68                                 var normals = [];
  69                                 var num_points = points.length;
  70
  71                                 for ( var i = 0; i < num_points; i ++ ) {
  72
  73                                         var v1 = points[ i ];
  74                                         var v2 = points[ ( i + 1 ) % num_points ];
  75                                         v1 = subtract( v1, origin );
  76                                         v2 = subtract( v2, origin );
  77                                         normals.push( normalize( cross( v1, v2 ) ) );
  78
  79                                 }
  80
  81                                 var normal = [ 0, 0, 0 ];
  82
  83                                 for ( var i = 0; i < normals.length; i ++ ) {
  84
  85                                         normal[ 0 ] += normals[ i ][ 0 ];
  86                                         normal[ 1 ] += normals[ i ][ 1 ];
  87                                         normal[ 2 ] += normals[ i ][ 2 ];
  88
  89                                 }
  90
  91                                 normal[ 0 ] /= normals.length;
  92                                 normal[ 1 ] /= normals.length;
  93                                 normal[ 2 ] /= normals.length;
  94
  95                                 var idx = ( y * width + x ) * 4;
  96
  97                                 output[ idx ] = ( ( normal[ 0 ] + 1.0 ) / 2.0 * 255 ) | 0;
  98                                 output[ idx + 1 ] = ( ( normal[ 1 ] + 1.0 ) / 2.0 * 255 ) | 0;
  99                                 output[ idx + 2 ] = ( normal[ 2 ] * 255 ) | 0;
 100                                 output[ idx + 3 ] = 255;
 101
 102                         }
 103
 104                 }
 105
 106                 context.putImageData( imageData, 0, 0 );
 107
 108                 return canvas;
 109
 110         },
 111
 112         generateDataTexture: function ( width, height, color ) {
 113
 114                 var size = width * height;
 115                 var data = new Uint8Array( 3 * size );
 116
 117                 var r = Math.floor( color.r * 255 );
 118                 var g = Math.floor( color.g * 255 );
 119                 var b = Math.floor( color.b * 255 );
 120
 121                 for ( var i = 0; i < size; i ++ ) {
 122
 123                         data[ i * 3 ]      = r;
 124                         data[ i * 3 + 1 ] = g;
 125                         data[ i * 3 + 2 ] = b;
 126
 127                 }
 128
 129                 var texture = new THREE.DataTexture( data, width, height, THREE.RGBFormat );
 130                 texture.needsUpdate = true;
 131
 132                 return texture;
 133
 134         }
 135
 136 };