WebGLTextures.js 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. import { LinearFilter, NearestFilter, RGBFormat, RGBAFormat, DepthFormat, DepthStencilFormat, UnsignedShortType, UnsignedIntType, UnsignedInt248Type, FloatType, HalfFloatType, ClampToEdgeWrapping, NearestMipMapLinearFilter, NearestMipMapNearestFilter } from '../../constants';
  5. import { _Math } from '../../math/Math';
  6. function WebGLTextures( _gl, extensions, state, properties, capabilities, paramThreeToGL, info ) {
  7. var _infoMemory = info.memory;
  8. var _isWebGL2 = ( typeof WebGL2RenderingContext !== 'undefined' && _gl instanceof WebGL2RenderingContext );
  9. //
  10. function clampToMaxSize( image, maxSize ) {
  11. if ( image.width > maxSize || image.height > maxSize ) {
  12. // Warning: Scaling through the canvas will only work with images that use
  13. // premultiplied alpha.
  14. var scale = maxSize / Math.max( image.width, image.height );
  15. var canvas = document.createElementNS( 'http://www.w3.org/1999/xhtml', 'canvas' );
  16. canvas.width = Math.floor( image.width * scale );
  17. canvas.height = Math.floor( image.height * scale );
  18. var context = canvas.getContext( '2d' );
  19. context.drawImage( image, 0, 0, image.width, image.height, 0, 0, canvas.width, canvas.height );
  20. console.warn( 'THREE.WebGLRenderer: image is too big (' + image.width + 'x' + image.height + '). Resized to ' + canvas.width + 'x' + canvas.height, image );
  21. return canvas;
  22. }
  23. return image;
  24. }
  25. function isPowerOfTwo( image ) {
  26. return _Math.isPowerOfTwo( image.width ) && _Math.isPowerOfTwo( image.height );
  27. }
  28. function makePowerOfTwo( image ) {
  29. if ( image instanceof HTMLImageElement || image instanceof HTMLCanvasElement ) {
  30. var canvas = document.createElementNS( 'http://www.w3.org/1999/xhtml', 'canvas' );
  31. canvas.width = _Math.nearestPowerOfTwo( image.width );
  32. canvas.height = _Math.nearestPowerOfTwo( image.height );
  33. var context = canvas.getContext( '2d' );
  34. context.drawImage( image, 0, 0, canvas.width, canvas.height );
  35. console.warn( 'THREE.WebGLRenderer: image is not power of two (' + image.width + 'x' + image.height + '). Resized to ' + canvas.width + 'x' + canvas.height, image );
  36. return canvas;
  37. }
  38. return image;
  39. }
  40. function textureNeedsPowerOfTwo( texture ) {
  41. return (texture.wrapS !== ClampToEdgeWrapping || texture.wrapT !== ClampToEdgeWrapping ) || ( texture.minFilter !== NearestFilter && texture.minFilter !== LinearFilter );
  42. }
  43. // Fallback filters for non-power-of-2 textures
  44. function filterFallback( f ) {
  45. if ( f === NearestFilter || f === NearestMipMapNearestFilter || f === NearestMipMapLinearFilter ) {
  46. return _gl.NEAREST;
  47. }
  48. return _gl.LINEAR;
  49. }
  50. //
  51. function onTextureDispose( event ) {
  52. var texture = event.target;
  53. texture.removeEventListener( 'dispose', onTextureDispose );
  54. deallocateTexture( texture );
  55. _infoMemory.textures --;
  56. }
  57. function onRenderTargetDispose( event ) {
  58. var renderTarget = event.target;
  59. renderTarget.removeEventListener( 'dispose', onRenderTargetDispose );
  60. deallocateRenderTarget( renderTarget );
  61. _infoMemory.textures --;
  62. }
  63. //
  64. function deallocateTexture( texture ) {
  65. var textureProperties = properties.get( texture );
  66. if ( texture.image && textureProperties.__image__webglTextureCube ) {
  67. // cube texture
  68. _gl.deleteTexture( textureProperties.__image__webglTextureCube );
  69. } else {
  70. // 2D texture
  71. if ( textureProperties.__webglInit === undefined ) return;
  72. _gl.deleteTexture( textureProperties.__webglTexture );
  73. }
  74. // remove all webgl properties
  75. properties.delete( texture );
  76. }
  77. function deallocateRenderTarget( renderTarget ) {
  78. var renderTargetProperties = properties.get( renderTarget );
  79. var textureProperties = properties.get( renderTarget.texture );
  80. if ( ! renderTarget ) return;
  81. if ( textureProperties.__webglTexture !== undefined ) {
  82. _gl.deleteTexture( textureProperties.__webglTexture );
  83. }
  84. if ( renderTarget.depthTexture ) {
  85. renderTarget.depthTexture.dispose();
  86. }
  87. if ( renderTarget.isWebGLRenderTargetCube ) {
  88. for ( var i = 0; i < 6; i ++ ) {
  89. _gl.deleteFramebuffer( renderTargetProperties.__webglFramebuffer[ i ] );
  90. if ( renderTargetProperties.__webglDepthbuffer ) _gl.deleteRenderbuffer( renderTargetProperties.__webglDepthbuffer[ i ] );
  91. }
  92. } else {
  93. _gl.deleteFramebuffer( renderTargetProperties.__webglFramebuffer );
  94. if ( renderTargetProperties.__webglDepthbuffer ) _gl.deleteRenderbuffer( renderTargetProperties.__webglDepthbuffer );
  95. }
  96. properties.delete( renderTarget.texture );
  97. properties.delete( renderTarget );
  98. }
  99. //
  100. function setTexture2D( texture, slot ) {
  101. var textureProperties = properties.get( texture );
  102. if ( texture.version > 0 && textureProperties.__version !== texture.version ) {
  103. var image = texture.image;
  104. if ( image === undefined ) {
  105. console.warn( 'THREE.WebGLRenderer: Texture marked for update but image is undefined', texture );
  106. } else if ( image.complete === false ) {
  107. console.warn( 'THREE.WebGLRenderer: Texture marked for update but image is incomplete', texture );
  108. } else {
  109. uploadTexture( textureProperties, texture, slot );
  110. return;
  111. }
  112. }
  113. state.activeTexture( _gl.TEXTURE0 + slot );
  114. state.bindTexture( _gl.TEXTURE_2D, textureProperties.__webglTexture );
  115. }
  116. function setTextureCube( texture, slot ) {
  117. var textureProperties = properties.get( texture );
  118. if ( texture.image.length === 6 ) {
  119. if ( texture.version > 0 && textureProperties.__version !== texture.version ) {
  120. if ( ! textureProperties.__image__webglTextureCube ) {
  121. texture.addEventListener( 'dispose', onTextureDispose );
  122. textureProperties.__image__webglTextureCube = _gl.createTexture();
  123. _infoMemory.textures ++;
  124. }
  125. state.activeTexture( _gl.TEXTURE0 + slot );
  126. state.bindTexture( _gl.TEXTURE_CUBE_MAP, textureProperties.__image__webglTextureCube );
  127. _gl.pixelStorei( _gl.UNPACK_FLIP_Y_WEBGL, texture.flipY );
  128. var isCompressed = (texture && texture.isCompressedTexture);
  129. var isDataTexture = (texture.image[ 0 ] && texture.image[ 0 ].isDataTexture);
  130. var cubeImage = [];
  131. for ( var i = 0; i < 6; i ++ ) {
  132. if ( ! isCompressed && ! isDataTexture ) {
  133. cubeImage[ i ] = clampToMaxSize( texture.image[ i ], capabilities.maxCubemapSize );
  134. } else {
  135. cubeImage[ i ] = isDataTexture ? texture.image[ i ].image : texture.image[ i ];
  136. }
  137. }
  138. var image = cubeImage[ 0 ],
  139. isPowerOfTwoImage = isPowerOfTwo( image ),
  140. glFormat = paramThreeToGL( texture.format ),
  141. glType = paramThreeToGL( texture.type );
  142. setTextureParameters( _gl.TEXTURE_CUBE_MAP, texture, isPowerOfTwoImage );
  143. for ( var i = 0; i < 6; i ++ ) {
  144. if ( ! isCompressed ) {
  145. if ( isDataTexture ) {
  146. state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, glFormat, cubeImage[ i ].width, cubeImage[ i ].height, 0, glFormat, glType, cubeImage[ i ].data );
  147. } else {
  148. state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, 0, glFormat, glFormat, glType, cubeImage[ i ] );
  149. }
  150. } else {
  151. var mipmap, mipmaps = cubeImage[ i ].mipmaps;
  152. for ( var j = 0, jl = mipmaps.length; j < jl; j ++ ) {
  153. mipmap = mipmaps[ j ];
  154. if ( texture.format !== RGBAFormat && texture.format !== RGBFormat ) {
  155. if ( state.getCompressedTextureFormats().indexOf( glFormat ) > - 1 ) {
  156. state.compressedTexImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j, glFormat, mipmap.width, mipmap.height, 0, mipmap.data );
  157. } else {
  158. console.warn( "THREE.WebGLRenderer: Attempt to load unsupported compressed texture format in .setTextureCube()" );
  159. }
  160. } else {
  161. state.texImage2D( _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i, j, glFormat, mipmap.width, mipmap.height, 0, glFormat, glType, mipmap.data );
  162. }
  163. }
  164. }
  165. }
  166. if ( texture.generateMipmaps && isPowerOfTwoImage ) {
  167. _gl.generateMipmap( _gl.TEXTURE_CUBE_MAP );
  168. }
  169. textureProperties.__version = texture.version;
  170. if ( texture.onUpdate ) texture.onUpdate( texture );
  171. } else {
  172. state.activeTexture( _gl.TEXTURE0 + slot );
  173. state.bindTexture( _gl.TEXTURE_CUBE_MAP, textureProperties.__image__webglTextureCube );
  174. }
  175. }
  176. }
  177. function setTextureCubeDynamic( texture, slot ) {
  178. state.activeTexture( _gl.TEXTURE0 + slot );
  179. state.bindTexture( _gl.TEXTURE_CUBE_MAP, properties.get( texture ).__webglTexture );
  180. }
  181. function setTextureParameters( textureType, texture, isPowerOfTwoImage ) {
  182. var extension;
  183. if ( isPowerOfTwoImage ) {
  184. _gl.texParameteri( textureType, _gl.TEXTURE_WRAP_S, paramThreeToGL( texture.wrapS ) );
  185. _gl.texParameteri( textureType, _gl.TEXTURE_WRAP_T, paramThreeToGL( texture.wrapT ) );
  186. _gl.texParameteri( textureType, _gl.TEXTURE_MAG_FILTER, paramThreeToGL( texture.magFilter ) );
  187. _gl.texParameteri( textureType, _gl.TEXTURE_MIN_FILTER, paramThreeToGL( texture.minFilter ) );
  188. } else {
  189. _gl.texParameteri( textureType, _gl.TEXTURE_WRAP_S, _gl.CLAMP_TO_EDGE );
  190. _gl.texParameteri( textureType, _gl.TEXTURE_WRAP_T, _gl.CLAMP_TO_EDGE );
  191. if ( texture.wrapS !== ClampToEdgeWrapping || texture.wrapT !== ClampToEdgeWrapping ) {
  192. console.warn( 'THREE.WebGLRenderer: Texture is not power of two. Texture.wrapS and Texture.wrapT should be set to THREE.ClampToEdgeWrapping.', texture );
  193. }
  194. _gl.texParameteri( textureType, _gl.TEXTURE_MAG_FILTER, filterFallback( texture.magFilter ) );
  195. _gl.texParameteri( textureType, _gl.TEXTURE_MIN_FILTER, filterFallback( texture.minFilter ) );
  196. if ( texture.minFilter !== NearestFilter && texture.minFilter !== LinearFilter ) {
  197. console.warn( 'THREE.WebGLRenderer: Texture is not power of two. Texture.minFilter should be set to THREE.NearestFilter or THREE.LinearFilter.', texture );
  198. }
  199. }
  200. extension = extensions.get( 'EXT_texture_filter_anisotropic' );
  201. if ( extension ) {
  202. if ( texture.type === FloatType && extensions.get( 'OES_texture_float_linear' ) === null ) return;
  203. if ( texture.type === HalfFloatType && extensions.get( 'OES_texture_half_float_linear' ) === null ) return;
  204. if ( texture.anisotropy > 1 || properties.get( texture ).__currentAnisotropy ) {
  205. _gl.texParameterf( textureType, extension.TEXTURE_MAX_ANISOTROPY_EXT, Math.min( texture.anisotropy, capabilities.getMaxAnisotropy() ) );
  206. properties.get( texture ).__currentAnisotropy = texture.anisotropy;
  207. }
  208. }
  209. }
  210. function uploadTexture( textureProperties, texture, slot ) {
  211. if ( textureProperties.__webglInit === undefined ) {
  212. textureProperties.__webglInit = true;
  213. texture.addEventListener( 'dispose', onTextureDispose );
  214. textureProperties.__webglTexture = _gl.createTexture();
  215. _infoMemory.textures ++;
  216. }
  217. state.activeTexture( _gl.TEXTURE0 + slot );
  218. state.bindTexture( _gl.TEXTURE_2D, textureProperties.__webglTexture );
  219. _gl.pixelStorei( _gl.UNPACK_FLIP_Y_WEBGL, texture.flipY );
  220. _gl.pixelStorei( _gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, texture.premultiplyAlpha );
  221. _gl.pixelStorei( _gl.UNPACK_ALIGNMENT, texture.unpackAlignment );
  222. var image = clampToMaxSize( texture.image, capabilities.maxTextureSize );
  223. if ( textureNeedsPowerOfTwo( texture ) && isPowerOfTwo( image ) === false ) {
  224. image = makePowerOfTwo( image );
  225. }
  226. var isPowerOfTwoImage = isPowerOfTwo( image ),
  227. glFormat = paramThreeToGL( texture.format ),
  228. glType = paramThreeToGL( texture.type );
  229. setTextureParameters( _gl.TEXTURE_2D, texture, isPowerOfTwoImage );
  230. var mipmap, mipmaps = texture.mipmaps;
  231. if ( texture.isDepthTexture ) {
  232. // populate depth texture with dummy data
  233. var internalFormat = _gl.DEPTH_COMPONENT;
  234. if ( texture.type === FloatType ) {
  235. if ( !_isWebGL2 ) throw new Error('Float Depth Texture only supported in WebGL2.0');
  236. internalFormat = _gl.DEPTH_COMPONENT32F;
  237. } else if ( _isWebGL2 ) {
  238. // WebGL 2.0 requires signed internalformat for glTexImage2D
  239. internalFormat = _gl.DEPTH_COMPONENT16;
  240. }
  241. if ( texture.format === DepthFormat && internalFormat === _gl.DEPTH_COMPONENT ) {
  242. // The error INVALID_OPERATION is generated by texImage2D if format and internalformat are
  243. // DEPTH_COMPONENT and type is not UNSIGNED_SHORT or UNSIGNED_INT
  244. // (https://www.khronos.org/registry/webgl/extensions/WEBGL_depth_texture/)
  245. if ( texture.type !== UnsignedShortType && texture.type !== UnsignedIntType ) {
  246. console.warn( 'THREE.WebGLRenderer: Use UnsignedShortType or UnsignedIntType for DepthFormat DepthTexture.' );
  247. texture.type = UnsignedShortType;
  248. glType = paramThreeToGL( texture.type );
  249. }
  250. }
  251. // Depth stencil textures need the DEPTH_STENCIL internal format
  252. // (https://www.khronos.org/registry/webgl/extensions/WEBGL_depth_texture/)
  253. if ( texture.format === DepthStencilFormat ) {
  254. internalFormat = _gl.DEPTH_STENCIL;
  255. // The error INVALID_OPERATION is generated by texImage2D if format and internalformat are
  256. // DEPTH_STENCIL and type is not UNSIGNED_INT_24_8_WEBGL.
  257. // (https://www.khronos.org/registry/webgl/extensions/WEBGL_depth_texture/)
  258. if ( texture.type !== UnsignedInt248Type ) {
  259. console.warn( 'THREE.WebGLRenderer: Use UnsignedInt248Type for DepthStencilFormat DepthTexture.' );
  260. texture.type = UnsignedInt248Type;
  261. glType = paramThreeToGL( texture.type );
  262. }
  263. }
  264. state.texImage2D( _gl.TEXTURE_2D, 0, internalFormat, image.width, image.height, 0, glFormat, glType, null );
  265. } else if ( texture.isDataTexture ) {
  266. // use manually created mipmaps if available
  267. // if there are no manual mipmaps
  268. // set 0 level mipmap and then use GL to generate other mipmap levels
  269. if ( mipmaps.length > 0 && isPowerOfTwoImage ) {
  270. for ( var i = 0, il = mipmaps.length; i < il; i ++ ) {
  271. mipmap = mipmaps[ i ];
  272. state.texImage2D( _gl.TEXTURE_2D, i, glFormat, mipmap.width, mipmap.height, 0, glFormat, glType, mipmap.data );
  273. }
  274. texture.generateMipmaps = false;
  275. } else {
  276. state.texImage2D( _gl.TEXTURE_2D, 0, glFormat, image.width, image.height, 0, glFormat, glType, image.data );
  277. }
  278. } else if ( texture.isCompressedTexture ) {
  279. for ( var i = 0, il = mipmaps.length; i < il; i ++ ) {
  280. mipmap = mipmaps[ i ];
  281. if ( texture.format !== RGBAFormat && texture.format !== RGBFormat ) {
  282. if ( state.getCompressedTextureFormats().indexOf( glFormat ) > - 1 ) {
  283. state.compressedTexImage2D( _gl.TEXTURE_2D, i, glFormat, mipmap.width, mipmap.height, 0, mipmap.data );
  284. } else {
  285. console.warn( "THREE.WebGLRenderer: Attempt to load unsupported compressed texture format in .uploadTexture()" );
  286. }
  287. } else {
  288. state.texImage2D( _gl.TEXTURE_2D, i, glFormat, mipmap.width, mipmap.height, 0, glFormat, glType, mipmap.data );
  289. }
  290. }
  291. } else {
  292. // regular Texture (image, video, canvas)
  293. // use manually created mipmaps if available
  294. // if there are no manual mipmaps
  295. // set 0 level mipmap and then use GL to generate other mipmap levels
  296. if ( mipmaps.length > 0 && isPowerOfTwoImage ) {
  297. for ( var i = 0, il = mipmaps.length; i < il; i ++ ) {
  298. mipmap = mipmaps[ i ];
  299. state.texImage2D( _gl.TEXTURE_2D, i, glFormat, glFormat, glType, mipmap );
  300. }
  301. texture.generateMipmaps = false;
  302. } else {
  303. state.texImage2D( _gl.TEXTURE_2D, 0, glFormat, glFormat, glType, image );
  304. }
  305. }
  306. if ( texture.generateMipmaps && isPowerOfTwoImage ) _gl.generateMipmap( _gl.TEXTURE_2D );
  307. textureProperties.__version = texture.version;
  308. if ( texture.onUpdate ) texture.onUpdate( texture );
  309. }
  310. // Render targets
  311. // Setup storage for target texture and bind it to correct framebuffer
  312. function setupFrameBufferTexture( framebuffer, renderTarget, attachment, textureTarget ) {
  313. var glFormat = paramThreeToGL( renderTarget.texture.format );
  314. var glType = paramThreeToGL( renderTarget.texture.type );
  315. state.texImage2D( textureTarget, 0, glFormat, renderTarget.width, renderTarget.height, 0, glFormat, glType, null );
  316. _gl.bindFramebuffer( _gl.FRAMEBUFFER, framebuffer );
  317. _gl.framebufferTexture2D( _gl.FRAMEBUFFER, attachment, textureTarget, properties.get( renderTarget.texture ).__webglTexture, 0 );
  318. _gl.bindFramebuffer( _gl.FRAMEBUFFER, null );
  319. }
  320. // Setup storage for internal depth/stencil buffers and bind to correct framebuffer
  321. function setupRenderBufferStorage( renderbuffer, renderTarget ) {
  322. _gl.bindRenderbuffer( _gl.RENDERBUFFER, renderbuffer );
  323. if ( renderTarget.depthBuffer && ! renderTarget.stencilBuffer ) {
  324. _gl.renderbufferStorage( _gl.RENDERBUFFER, _gl.DEPTH_COMPONENT16, renderTarget.width, renderTarget.height );
  325. _gl.framebufferRenderbuffer( _gl.FRAMEBUFFER, _gl.DEPTH_ATTACHMENT, _gl.RENDERBUFFER, renderbuffer );
  326. } else if ( renderTarget.depthBuffer && renderTarget.stencilBuffer ) {
  327. _gl.renderbufferStorage( _gl.RENDERBUFFER, _gl.DEPTH_STENCIL, renderTarget.width, renderTarget.height );
  328. _gl.framebufferRenderbuffer( _gl.FRAMEBUFFER, _gl.DEPTH_STENCIL_ATTACHMENT, _gl.RENDERBUFFER, renderbuffer );
  329. } else {
  330. // FIXME: We don't support !depth !stencil
  331. _gl.renderbufferStorage( _gl.RENDERBUFFER, _gl.RGBA4, renderTarget.width, renderTarget.height );
  332. }
  333. _gl.bindRenderbuffer( _gl.RENDERBUFFER, null );
  334. }
  335. // Setup resources for a Depth Texture for a FBO (needs an extension)
  336. function setupDepthTexture( framebuffer, renderTarget ) {
  337. var isCube = ( renderTarget && renderTarget.isWebGLRenderTargetCube );
  338. if ( isCube ) throw new Error('Depth Texture with cube render targets is not supported!');
  339. _gl.bindFramebuffer( _gl.FRAMEBUFFER, framebuffer );
  340. if ( !( renderTarget.depthTexture && renderTarget.depthTexture.isDepthTexture ) ) {
  341. throw new Error('renderTarget.depthTexture must be an instance of THREE.DepthTexture');
  342. }
  343. // upload an empty depth texture with framebuffer size
  344. if ( !properties.get( renderTarget.depthTexture ).__webglTexture ||
  345. renderTarget.depthTexture.image.width !== renderTarget.width ||
  346. renderTarget.depthTexture.image.height !== renderTarget.height ) {
  347. renderTarget.depthTexture.image.width = renderTarget.width;
  348. renderTarget.depthTexture.image.height = renderTarget.height;
  349. renderTarget.depthTexture.needsUpdate = true;
  350. }
  351. setTexture2D( renderTarget.depthTexture, 0 );
  352. var webglDepthTexture = properties.get( renderTarget.depthTexture ).__webglTexture;
  353. if ( renderTarget.depthTexture.format === DepthFormat ) {
  354. _gl.framebufferTexture2D( _gl.FRAMEBUFFER, _gl.DEPTH_ATTACHMENT, _gl.TEXTURE_2D, webglDepthTexture, 0 );
  355. } else if ( renderTarget.depthTexture.format === DepthStencilFormat ) {
  356. _gl.framebufferTexture2D( _gl.FRAMEBUFFER, _gl.DEPTH_STENCIL_ATTACHMENT, _gl.TEXTURE_2D, webglDepthTexture, 0 );
  357. } else {
  358. throw new Error('Unknown depthTexture format')
  359. }
  360. }
  361. // Setup GL resources for a non-texture depth buffer
  362. function setupDepthRenderbuffer( renderTarget ) {
  363. var renderTargetProperties = properties.get( renderTarget );
  364. var isCube = ( renderTarget.isWebGLRenderTargetCube === true );
  365. if ( renderTarget.depthTexture ) {
  366. if ( isCube ) throw new Error('target.depthTexture not supported in Cube render targets');
  367. setupDepthTexture( renderTargetProperties.__webglFramebuffer, renderTarget );
  368. } else {
  369. if ( isCube ) {
  370. renderTargetProperties.__webglDepthbuffer = [];
  371. for ( var i = 0; i < 6; i ++ ) {
  372. _gl.bindFramebuffer( _gl.FRAMEBUFFER, renderTargetProperties.__webglFramebuffer[ i ] );
  373. renderTargetProperties.__webglDepthbuffer[ i ] = _gl.createRenderbuffer();
  374. setupRenderBufferStorage( renderTargetProperties.__webglDepthbuffer[ i ], renderTarget );
  375. }
  376. } else {
  377. _gl.bindFramebuffer( _gl.FRAMEBUFFER, renderTargetProperties.__webglFramebuffer );
  378. renderTargetProperties.__webglDepthbuffer = _gl.createRenderbuffer();
  379. setupRenderBufferStorage( renderTargetProperties.__webglDepthbuffer, renderTarget );
  380. }
  381. }
  382. _gl.bindFramebuffer( _gl.FRAMEBUFFER, null );
  383. }
  384. // Set up GL resources for the render target
  385. function setupRenderTarget( renderTarget ) {
  386. var renderTargetProperties = properties.get( renderTarget );
  387. var textureProperties = properties.get( renderTarget.texture );
  388. renderTarget.addEventListener( 'dispose', onRenderTargetDispose );
  389. textureProperties.__webglTexture = _gl.createTexture();
  390. _infoMemory.textures ++;
  391. var isCube = ( renderTarget.isWebGLRenderTargetCube === true );
  392. var isTargetPowerOfTwo = isPowerOfTwo( renderTarget );
  393. // Setup framebuffer
  394. if ( isCube ) {
  395. renderTargetProperties.__webglFramebuffer = [];
  396. for ( var i = 0; i < 6; i ++ ) {
  397. renderTargetProperties.__webglFramebuffer[ i ] = _gl.createFramebuffer();
  398. }
  399. } else {
  400. renderTargetProperties.__webglFramebuffer = _gl.createFramebuffer();
  401. }
  402. // Setup color buffer
  403. if ( isCube ) {
  404. state.bindTexture( _gl.TEXTURE_CUBE_MAP, textureProperties.__webglTexture );
  405. setTextureParameters( _gl.TEXTURE_CUBE_MAP, renderTarget.texture, isTargetPowerOfTwo );
  406. for ( var i = 0; i < 6; i ++ ) {
  407. setupFrameBufferTexture( renderTargetProperties.__webglFramebuffer[ i ], renderTarget, _gl.COLOR_ATTACHMENT0, _gl.TEXTURE_CUBE_MAP_POSITIVE_X + i );
  408. }
  409. if ( renderTarget.texture.generateMipmaps && isTargetPowerOfTwo ) _gl.generateMipmap( _gl.TEXTURE_CUBE_MAP );
  410. state.bindTexture( _gl.TEXTURE_CUBE_MAP, null );
  411. } else {
  412. state.bindTexture( _gl.TEXTURE_2D, textureProperties.__webglTexture );
  413. setTextureParameters( _gl.TEXTURE_2D, renderTarget.texture, isTargetPowerOfTwo );
  414. setupFrameBufferTexture( renderTargetProperties.__webglFramebuffer, renderTarget, _gl.COLOR_ATTACHMENT0, _gl.TEXTURE_2D );
  415. if ( renderTarget.texture.generateMipmaps && isTargetPowerOfTwo ) _gl.generateMipmap( _gl.TEXTURE_2D );
  416. state.bindTexture( _gl.TEXTURE_2D, null );
  417. }
  418. // Setup depth and stencil buffers
  419. if ( renderTarget.depthBuffer ) {
  420. setupDepthRenderbuffer( renderTarget );
  421. }
  422. }
  423. function updateRenderTargetMipmap( renderTarget ) {
  424. var texture = renderTarget.texture;
  425. if ( texture.generateMipmaps && isPowerOfTwo( renderTarget ) &&
  426. texture.minFilter !== NearestFilter &&
  427. texture.minFilter !== LinearFilter ) {
  428. var target = (renderTarget && renderTarget.isWebGLRenderTargetCube) ? _gl.TEXTURE_CUBE_MAP : _gl.TEXTURE_2D;
  429. var webglTexture = properties.get( texture ).__webglTexture;
  430. state.bindTexture( target, webglTexture );
  431. _gl.generateMipmap( target );
  432. state.bindTexture( target, null );
  433. }
  434. }
  435. this.setTexture2D = setTexture2D;
  436. this.setTextureCube = setTextureCube;
  437. this.setTextureCubeDynamic = setTextureCubeDynamic;
  438. this.setupRenderTarget = setupRenderTarget;
  439. this.updateRenderTargetMipmap = updateRenderTargetMipmap;
  440. }
  441. export { WebGLTextures };
粤ICP备19079148号