ImageUtils.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. /**
  2. * @author alteredq / http://alteredqualia.com/
  3. * @author mrdoob / http://mrdoob.com/
  4. */
  5. THREE.ImageUtils = {
  6. crossOrigin: '',
  7. loadTexture: function ( path, mapping, callback ) {
  8. var image = new Image(), texture = new THREE.Texture( image, mapping );
  9. image.onload = function () { texture.needsUpdate = true; if ( callback ) callback( this ); };
  10. image.crossOrigin = this.crossOrigin;
  11. image.src = path;
  12. return texture;
  13. },
  14. loadTextureCube: function ( array, mapping, callback ) {
  15. var i, l, images = [], texture = new THREE.Texture( images, mapping );
  16. images.loadCount = 0;
  17. for ( i = 0, l = array.length; i < l; ++i ) {
  18. images[ i ] = new Image();
  19. images[ i ].onload = function () {
  20. images.loadCount += 1;
  21. if ( images.loadCount === 6 ) texture.needsUpdate = true;
  22. if ( callback ) callback( this );
  23. };
  24. images[ i ].crossOrigin = '';
  25. images[ i ].src = array[ i ];
  26. }
  27. return texture;
  28. },
  29. getNormalMap: function ( image, depth ) {
  30. // Adapted from http://www.paulbrunt.co.uk/lab/heightnormal/
  31. var cross = function ( a, b ) {
  32. 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 ] ];
  33. }
  34. var subtract = function ( a, b ) {
  35. return [ a[ 0 ] - b[ 0 ], a[ 1 ] - b[ 1 ], a[ 2 ] - b[ 2 ] ];
  36. }
  37. var normalize = function ( a ) {
  38. var l = Math.sqrt( a[ 0 ] * a[ 0 ] + a[ 1 ] * a[ 1 ] + a[ 2 ] * a[ 2 ] );
  39. return [ a[ 0 ] / l, a[ 1 ] / l, a[ 2 ] / l ];
  40. }
  41. var depth = depth | 1;
  42. var width = image.width;
  43. var height = image.height;
  44. var canvas = document.createElement( 'canvas' );
  45. canvas.width = width;
  46. canvas.height = height;
  47. var context = canvas.getContext( '2d' );
  48. context.drawImage( image, 0, 0 );
  49. var data = context.getImageData( 0, 0, width, height ).data;
  50. var imageData = context.createImageData( width, height );
  51. var output = imageData.data;
  52. for ( var x = 0; x < width; x ++ ) {
  53. for ( var y = 1; y < height; y ++ ) {
  54. var ly = y - 1 < 0 ? height - 1 : y - 1;
  55. var uy = ( y + 1 ) % height;
  56. var lx = x - 1 < 0 ? width - 1 : x - 1;
  57. var ux = ( x + 1 ) % width;
  58. var points = [];
  59. var origin = [ 0, 0, data[ ( y * width + x ) * 4 ] / 255 * depth ];
  60. points.push( [ - 1, 0, data[ ( y * width + lx ) * 4 ] / 255 * depth ] );
  61. points.push( [ - 1, - 1, data[ ( ly * width + lx ) * 4 ] / 255 * depth ] );
  62. points.push( [ 0, - 1, data[ ( ly * width + x ) * 4 ] / 255 * depth ] );
  63. points.push( [ 1, - 1, data[ ( ly * width + ux ) * 4 ] / 255 * depth ] );
  64. points.push( [ 1, 0, data[ ( y * width + ux ) * 4 ] / 255 * depth ] );
  65. points.push( [ 1, 1, data[ ( uy * width + ux ) * 4 ] / 255 * depth ] );
  66. points.push( [ 0, 1, data[ ( uy * width + x ) * 4 ] / 255 * depth ] );
  67. points.push( [ - 1, 1, data[ ( uy * width + lx ) * 4 ] / 255 * depth ] );
  68. var normals = [];
  69. var num_points = points.length;
  70. for ( var i = 0; i < num_points; i ++ ) {
  71. var v1 = points[ i ];
  72. var v2 = points[ ( i + 1 ) % num_points ];
  73. v1 = subtract( v1, origin );
  74. v2 = subtract( v2, origin );
  75. normals.push( normalize( cross( v1, v2 ) ) );
  76. }
  77. var normal = [ 0, 0, 0 ];
  78. for ( var i = 0; i < normals.length; i ++ ) {
  79. normal[ 0 ] += normals[ i ][ 0 ];
  80. normal[ 1 ] += normals[ i ][ 1 ];
  81. normal[ 2 ] += normals[ i ][ 2 ];
  82. }
  83. normal[ 0 ] /= normals.length;
  84. normal[ 1 ] /= normals.length;
  85. normal[ 2 ] /= normals.length;
  86. var idx = ( y * width + x ) * 4;
  87. output[ idx ] = ( ( normal[ 0 ] + 1.0 ) / 2.0 * 255 ) | 0;
  88. output[ idx + 1 ] = ( ( normal[ 1 ] + 1.0 / 2.0 ) * 255 ) | 0;
  89. output[ idx + 2 ] = ( normal[ 2 ] * 255 ) | 0;
  90. output[ idx + 3 ] = 255;
  91. }
  92. }
  93. context.putImageData( imageData, 0, 0 );
  94. return canvas;
  95. }
  96. };
粤ICP备19079148号