RoughnessMipmapper.js 6.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. /**
  2. * @author Emmett Lalish / elalish
  3. *
  4. * This class generates custom mipmaps for a roughness map by encoding the lost variation in the
  5. * normal map mip levels as increased roughness in the corresponding roughness mip levels. This
  6. * helps with rendering accuracy for MeshStandardMaterial, and also helps with anti-aliasing when
  7. * using PMREM. If the normal map is larger than the roughness map, the roughness map will be
  8. * enlarged to match the dimensions of the normal map.
  9. */
  10. import {
  11. LinearMipMapLinearFilter,
  12. MathUtils,
  13. Mesh,
  14. NoBlending,
  15. OrthographicCamera,
  16. PlaneBufferGeometry,
  17. RawShaderMaterial,
  18. Scene,
  19. Vector2,
  20. WebGLRenderTarget,
  21. Vector4
  22. } from "../../../build/three.module.js";
  23. var RoughnessMipmapper = ( function () {
  24. var _mipmapMaterial = _getMipmapMaterial();
  25. var _scene = new Scene();
  26. _scene.add( new Mesh( new PlaneBufferGeometry( 2, 2 ), _mipmapMaterial ) );
  27. var _flatCamera = new OrthographicCamera( 0, 1, 0, 1, 0, 1 );
  28. var _tempTarget = null;
  29. var _renderer = null;
  30. // constructor
  31. var RoughnessMipmapper = function ( renderer ) {
  32. _renderer = renderer;
  33. _renderer.compile( _scene, _flatCamera );
  34. };
  35. RoughnessMipmapper.prototype = {
  36. constructor: RoughnessMipmapper,
  37. generateMipmaps: function ( material ) {
  38. var { roughnessMap, normalMap } = material;
  39. if ( roughnessMap == null || normalMap == null || ! roughnessMap.generateMipmaps ||
  40. material.userData.roughnessUpdated ) return;
  41. material.userData.roughnessUpdated = true;
  42. var width = Math.max( roughnessMap.image.width, normalMap.image.width );
  43. var height = Math.max( roughnessMap.image.height, normalMap.image.height );
  44. if ( ! MathUtils.isPowerOfTwo( width ) || ! MathUtils.isPowerOfTwo( height ) ) return;
  45. var oldTarget = _renderer.getRenderTarget();
  46. var autoClear = _renderer.autoClear;
  47. _renderer.autoClear = false;
  48. if ( _tempTarget == null || _tempTarget.width !== width || _tempTarget.height !== height ) {
  49. if ( _tempTarget != null ) _tempTarget.dispose();
  50. _tempTarget = new WebGLRenderTarget( width, height, { depthBuffer: false, stencilBuffer: false } );
  51. _tempTarget.scissorTest = true;
  52. }
  53. if ( width !== roughnessMap.image.width || height !== roughnessMap.image.height ) {
  54. var newRoughnessTarget = new WebGLRenderTarget( width, height, {
  55. minFilter: LinearMipMapLinearFilter,
  56. depthBuffer: false,
  57. stencilBuffer: false
  58. } );
  59. newRoughnessTarget.texture.generateMipmaps = true;
  60. // Setting the render target causes the memory to be allocated.
  61. _renderer.setRenderTarget( newRoughnessTarget );
  62. material.roughnessMap = newRoughnessTarget.texture;
  63. if ( material.metalnessMap == roughnessMap ) material.metalnessMap = material.roughnessMap;
  64. if ( material.aoMap == roughnessMap ) material.aoMap = material.roughnessMap;
  65. }
  66. _mipmapMaterial.uniforms.roughnessMap.value = roughnessMap;
  67. _mipmapMaterial.uniforms.normalMap.value = normalMap;
  68. var dpr = _renderer.getPixelRatio();
  69. var position = new Vector2( 0, 0 );
  70. var texelSize = _mipmapMaterial.uniforms.texelSize.value;
  71. for ( var mip = 0; width >= 1 && height >= 1;
  72. ++ mip, width /= 2, height /= 2 ) {
  73. // Rendering to a mip level is not allowed in webGL1. Instead we must set
  74. // up a secondary texture to write the result to, then copy it back to the
  75. // proper mipmap level.
  76. texelSize.set( 1.0 / width, 1.0 / height );
  77. if ( mip == 0 ) texelSize.set( 0.0, 0.0 );
  78. var viewport = new Vector4( position.x, position.y, width / dpr, height / dpr );
  79. _tempTarget.viewport.copy( viewport );
  80. _tempTarget.scissor.copy( viewport );
  81. _renderer.setRenderTarget( _tempTarget );
  82. _renderer.render( _scene, _flatCamera );
  83. _renderer.copyFramebufferToTexture( position, material.roughnessMap, mip );
  84. _mipmapMaterial.uniforms.roughnessMap.value = material.roughnessMap;
  85. }
  86. if ( roughnessMap !== material.roughnessMap ) roughnessMap.dispose();
  87. _renderer.setRenderTarget( oldTarget );
  88. _renderer.autoClear = autoClear;
  89. },
  90. dispose: function ( ) {
  91. _mipmapMaterial.dispose();
  92. _scene.children[ 0 ].geometry.dispose();
  93. if ( _tempTarget != null ) _tempTarget.dispose();
  94. }
  95. };
  96. function _getMipmapMaterial() {
  97. var shaderMaterial = new RawShaderMaterial( {
  98. uniforms: {
  99. roughnessMap: { value: null },
  100. normalMap: { value: null },
  101. texelSize: { value: new Vector2( 1, 1 ) }
  102. },
  103. vertexShader: `
  104. precision mediump float;
  105. precision mediump int;
  106. attribute vec3 position;
  107. attribute vec2 uv;
  108. varying vec2 vUv;
  109. void main() {
  110. vUv = uv;
  111. gl_Position = vec4( position, 1.0 );
  112. }
  113. `,
  114. fragmentShader: `
  115. precision mediump float;
  116. precision mediump int;
  117. varying vec2 vUv;
  118. uniform sampler2D roughnessMap;
  119. uniform sampler2D normalMap;
  120. uniform vec2 texelSize;
  121. #define ENVMAP_TYPE_CUBE_UV
  122. vec4 envMapTexelToLinear(vec4 a){return a;}
  123. #include <cube_uv_reflection_fragment>
  124. float roughnessToVariance(float roughness) {
  125. float variance = 0.0;
  126. if (roughness >= r1) {
  127. variance = (r0 - roughness) * (v1 - v0) / (r0 - r1) + v0;
  128. } else if (roughness >= r4) {
  129. variance = (r1 - roughness) * (v4 - v1) / (r1 - r4) + v1;
  130. } else if (roughness >= r5) {
  131. variance = (r4 - roughness) * (v5 - v4) / (r4 - r5) + v4;
  132. } else {
  133. float roughness2 = roughness * roughness;
  134. variance = 1.79 * roughness2 * roughness2;
  135. }
  136. return variance;
  137. }
  138. float varianceToRoughness(float variance) {
  139. float roughness = 0.0;
  140. if (variance >= v1) {
  141. roughness = (v0 - variance) * (r1 - r0) / (v0 - v1) + r0;
  142. } else if (variance >= v4) {
  143. roughness = (v1 - variance) * (r4 - r1) / (v1 - v4) + r1;
  144. } else if (variance >= v5) {
  145. roughness = (v4 - variance) * (r5 - r4) / (v4 - v5) + r4;
  146. } else {
  147. roughness = pow(0.559 * variance, 0.25);// 0.559 = 1.0 / 1.79
  148. }
  149. return roughness;
  150. }
  151. void main() {
  152. gl_FragColor = texture2D(roughnessMap, vUv, -1.0);
  153. if (texelSize.x == 0.0) return;
  154. float roughness = gl_FragColor.g;
  155. float variance = roughnessToVariance(roughness);
  156. vec3 avgNormal;
  157. for (float x = -1.0; x < 2.0; x += 2.0) {
  158. for (float y = -1.0; y < 2.0; y += 2.0) {
  159. vec2 uv = vUv + vec2(x, y) * 0.25 * texelSize;
  160. avgNormal += normalize(texture2D(normalMap, uv, -1.0).xyz - 0.5);
  161. }
  162. }
  163. variance += 1.0 - 0.25 * length(avgNormal);
  164. gl_FragColor.g = varianceToRoughness(variance);
  165. }
  166. `,
  167. blending: NoBlending,
  168. depthTest: false,
  169. depthWrite: false
  170. } );
  171. shaderMaterial.type = 'RoughnessMipmapper';
  172. return shaderMaterial;
  173. }
  174. return RoughnessMipmapper;
  175. } )();
  176. export { RoughnessMipmapper };