Texture.js 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330
  1. import { EventDispatcher } from '../core/EventDispatcher.js';
  2. import {
  3. MirroredRepeatWrapping,
  4. ClampToEdgeWrapping,
  5. RepeatWrapping,
  6. LinearEncoding,
  7. UnsignedByteType,
  8. RGBAFormat,
  9. LinearMipmapLinearFilter,
  10. LinearFilter,
  11. UVMapping
  12. } from '../constants.js';
  13. import { MathUtils } from '../math/MathUtils.js';
  14. import { Vector2 } from '../math/Vector2.js';
  15. import { Matrix3 } from '../math/Matrix3.js';
  16. import { ImageUtils } from '../extras/ImageUtils.js';
  17. let textureId = 0;
  18. function Texture( image, mapping, wrapS, wrapT, magFilter, minFilter, format, type, anisotropy, encoding ) {
  19. Object.defineProperty( this, 'id', { value: textureId ++ } );
  20. this.uuid = MathUtils.generateUUID();
  21. this.name = '';
  22. this.image = image !== undefined ? image : Texture.DEFAULT_IMAGE;
  23. this.mipmaps = [];
  24. this.mapping = mapping !== undefined ? mapping : Texture.DEFAULT_MAPPING;
  25. this.wrapS = wrapS !== undefined ? wrapS : ClampToEdgeWrapping;
  26. this.wrapT = wrapT !== undefined ? wrapT : ClampToEdgeWrapping;
  27. this.magFilter = magFilter !== undefined ? magFilter : LinearFilter;
  28. this.minFilter = minFilter !== undefined ? minFilter : LinearMipmapLinearFilter;
  29. this.anisotropy = anisotropy !== undefined ? anisotropy : 1;
  30. this.format = format !== undefined ? format : RGBAFormat;
  31. this.internalFormat = null;
  32. this.type = type !== undefined ? type : UnsignedByteType;
  33. this.offset = new Vector2( 0, 0 );
  34. this.repeat = new Vector2( 1, 1 );
  35. this.center = new Vector2( 0, 0 );
  36. this.rotation = 0;
  37. this.matrixAutoUpdate = true;
  38. this.matrix = new Matrix3();
  39. this.generateMipmaps = true;
  40. this.premultiplyAlpha = false;
  41. this.flipY = true;
  42. this.unpackAlignment = 4; // valid values: 1, 2, 4, 8 (see http://www.khronos.org/opengles/sdk/docs/man/xhtml/glPixelStorei.xml)
  43. // Values of encoding !== THREE.LinearEncoding only supported on map, envMap and emissiveMap.
  44. //
  45. // Also changing the encoding after already used by a Material will not automatically make the Material
  46. // update. You need to explicitly call Material.needsUpdate to trigger it to recompile.
  47. this.encoding = encoding !== undefined ? encoding : LinearEncoding;
  48. this.version = 0;
  49. this.onUpdate = null;
  50. }
  51. Texture.DEFAULT_IMAGE = undefined;
  52. Texture.DEFAULT_MAPPING = UVMapping;
  53. Texture.prototype = Object.assign( Object.create( EventDispatcher.prototype ), {
  54. constructor: Texture,
  55. isTexture: true,
  56. updateMatrix: function () {
  57. this.matrix.setUvTransform( this.offset.x, this.offset.y, this.repeat.x, this.repeat.y, this.rotation, this.center.x, this.center.y );
  58. },
  59. clone: function () {
  60. return new this.constructor().copy( this );
  61. },
  62. copy: function ( source ) {
  63. this.name = source.name;
  64. this.image = source.image;
  65. this.mipmaps = source.mipmaps.slice( 0 );
  66. this.mapping = source.mapping;
  67. this.wrapS = source.wrapS;
  68. this.wrapT = source.wrapT;
  69. this.magFilter = source.magFilter;
  70. this.minFilter = source.minFilter;
  71. this.anisotropy = source.anisotropy;
  72. this.format = source.format;
  73. this.internalFormat = source.internalFormat;
  74. this.type = source.type;
  75. this.offset.copy( source.offset );
  76. this.repeat.copy( source.repeat );
  77. this.center.copy( source.center );
  78. this.rotation = source.rotation;
  79. this.matrixAutoUpdate = source.matrixAutoUpdate;
  80. this.matrix.copy( source.matrix );
  81. this.generateMipmaps = source.generateMipmaps;
  82. this.premultiplyAlpha = source.premultiplyAlpha;
  83. this.flipY = source.flipY;
  84. this.unpackAlignment = source.unpackAlignment;
  85. this.encoding = source.encoding;
  86. return this;
  87. },
  88. toJSON: function ( meta ) {
  89. const isRootObject = ( meta === undefined || typeof meta === 'string' );
  90. if ( ! isRootObject && meta.textures[ this.uuid ] !== undefined ) {
  91. return meta.textures[ this.uuid ];
  92. }
  93. const output = {
  94. metadata: {
  95. version: 4.5,
  96. type: 'Texture',
  97. generator: 'Texture.toJSON'
  98. },
  99. uuid: this.uuid,
  100. name: this.name,
  101. mapping: this.mapping,
  102. repeat: [ this.repeat.x, this.repeat.y ],
  103. offset: [ this.offset.x, this.offset.y ],
  104. center: [ this.center.x, this.center.y ],
  105. rotation: this.rotation,
  106. wrap: [ this.wrapS, this.wrapT ],
  107. format: this.format,
  108. type: this.type,
  109. encoding: this.encoding,
  110. minFilter: this.minFilter,
  111. magFilter: this.magFilter,
  112. anisotropy: this.anisotropy,
  113. flipY: this.flipY,
  114. premultiplyAlpha: this.premultiplyAlpha,
  115. unpackAlignment: this.unpackAlignment
  116. };
  117. if ( this.image !== undefined ) {
  118. // TODO: Move to THREE.Image
  119. const image = this.image;
  120. if ( image.uuid === undefined ) {
  121. image.uuid = MathUtils.generateUUID(); // UGH
  122. }
  123. if ( ! isRootObject && meta.images[ image.uuid ] === undefined ) {
  124. let url;
  125. if ( Array.isArray( image ) ) {
  126. // process array of images e.g. CubeTexture
  127. url = [];
  128. for ( let i = 0, l = image.length; i < l; i ++ ) {
  129. url.push( ImageUtils.getDataURL( image[ i ] ) );
  130. }
  131. } else {
  132. // process single image
  133. url = ImageUtils.getDataURL( image );
  134. }
  135. meta.images[ image.uuid ] = {
  136. uuid: image.uuid,
  137. url: url
  138. };
  139. }
  140. output.image = image.uuid;
  141. }
  142. if ( ! isRootObject ) {
  143. meta.textures[ this.uuid ] = output;
  144. }
  145. return output;
  146. },
  147. dispose: function () {
  148. this.dispatchEvent( { type: 'dispose' } );
  149. },
  150. transformUv: function ( uv ) {
  151. if ( this.mapping !== UVMapping ) return uv;
  152. uv.applyMatrix3( this.matrix );
  153. if ( uv.x < 0 || uv.x > 1 ) {
  154. switch ( this.wrapS ) {
  155. case RepeatWrapping:
  156. uv.x = uv.x - Math.floor( uv.x );
  157. break;
  158. case ClampToEdgeWrapping:
  159. uv.x = uv.x < 0 ? 0 : 1;
  160. break;
  161. case MirroredRepeatWrapping:
  162. if ( Math.abs( Math.floor( uv.x ) % 2 ) === 1 ) {
  163. uv.x = Math.ceil( uv.x ) - uv.x;
  164. } else {
  165. uv.x = uv.x - Math.floor( uv.x );
  166. }
  167. break;
  168. }
  169. }
  170. if ( uv.y < 0 || uv.y > 1 ) {
  171. switch ( this.wrapT ) {
  172. case RepeatWrapping:
  173. uv.y = uv.y - Math.floor( uv.y );
  174. break;
  175. case ClampToEdgeWrapping:
  176. uv.y = uv.y < 0 ? 0 : 1;
  177. break;
  178. case MirroredRepeatWrapping:
  179. if ( Math.abs( Math.floor( uv.y ) % 2 ) === 1 ) {
  180. uv.y = Math.ceil( uv.y ) - uv.y;
  181. } else {
  182. uv.y = uv.y - Math.floor( uv.y );
  183. }
  184. break;
  185. }
  186. }
  187. if ( this.flipY ) {
  188. uv.y = 1 - uv.y;
  189. }
  190. return uv;
  191. }
  192. } );
  193. Object.defineProperty( Texture.prototype, "needsUpdate", {
  194. set: function ( value ) {
  195. if ( value === true ) this.version ++;
  196. }
  197. } );
  198. export { Texture };
粤ICP备19079148号