SAOShader.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188
  1. import {
  2. Matrix4,
  3. Vector2
  4. } from '../../../build/three.module.js';
  5. /**
  6. * TODO
  7. */
  8. const SAOShader = {
  9. defines: {
  10. 'NUM_SAMPLES': 7,
  11. 'NUM_RINGS': 4,
  12. 'NORMAL_TEXTURE': 0,
  13. 'DIFFUSE_TEXTURE': 0,
  14. 'DEPTH_PACKING': 1,
  15. 'PERSPECTIVE_CAMERA': 1
  16. },
  17. uniforms: {
  18. 'tDepth': { value: null },
  19. 'tDiffuse': { value: null },
  20. 'tNormal': { value: null },
  21. 'size': { value: new Vector2( 512, 512 ) },
  22. 'cameraNear': { value: 1 },
  23. 'cameraFar': { value: 100 },
  24. 'cameraProjectionMatrix': { value: new Matrix4() },
  25. 'cameraInverseProjectionMatrix': { value: new Matrix4() },
  26. 'scale': { value: 1.0 },
  27. 'intensity': { value: 0.1 },
  28. 'bias': { value: 0.5 },
  29. 'minResolution': { value: 0.0 },
  30. 'kernelRadius': { value: 100.0 },
  31. 'randomSeed': { value: 0.0 }
  32. },
  33. vertexShader: /* glsl */`
  34. varying vec2 vUv;
  35. void main() {
  36. vUv = uv;
  37. gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
  38. }`,
  39. fragmentShader: /* glsl */`
  40. #include <common>
  41. varying vec2 vUv;
  42. #if DIFFUSE_TEXTURE == 1
  43. uniform sampler2D tDiffuse;
  44. #endif
  45. uniform sampler2D tDepth;
  46. #if NORMAL_TEXTURE == 1
  47. uniform sampler2D tNormal;
  48. #endif
  49. uniform float cameraNear;
  50. uniform float cameraFar;
  51. uniform mat4 cameraProjectionMatrix;
  52. uniform mat4 cameraInverseProjectionMatrix;
  53. uniform float scale;
  54. uniform float intensity;
  55. uniform float bias;
  56. uniform float kernelRadius;
  57. uniform float minResolution;
  58. uniform vec2 size;
  59. uniform float randomSeed;
  60. // RGBA depth
  61. #include <packing>
  62. vec4 getDefaultColor( const in vec2 screenPosition ) {
  63. #if DIFFUSE_TEXTURE == 1
  64. return texture2D( tDiffuse, vUv );
  65. #else
  66. return vec4( 1.0 );
  67. #endif
  68. }
  69. float getDepth( const in vec2 screenPosition ) {
  70. #if DEPTH_PACKING == 1
  71. return unpackRGBAToDepth( texture2D( tDepth, screenPosition ) );
  72. #else
  73. return texture2D( tDepth, screenPosition ).x;
  74. #endif
  75. }
  76. float getViewZ( const in float depth ) {
  77. #if PERSPECTIVE_CAMERA == 1
  78. return perspectiveDepthToViewZ( depth, cameraNear, cameraFar );
  79. #else
  80. return orthographicDepthToViewZ( depth, cameraNear, cameraFar );
  81. #endif
  82. }
  83. vec3 getViewPosition( const in vec2 screenPosition, const in float depth, const in float viewZ ) {
  84. float clipW = cameraProjectionMatrix[2][3] * viewZ + cameraProjectionMatrix[3][3];
  85. vec4 clipPosition = vec4( ( vec3( screenPosition, depth ) - 0.5 ) * 2.0, 1.0 );
  86. clipPosition *= clipW; // unprojection.
  87. return ( cameraInverseProjectionMatrix * clipPosition ).xyz;
  88. }
  89. vec3 getViewNormal( const in vec3 viewPosition, const in vec2 screenPosition ) {
  90. #if NORMAL_TEXTURE == 1
  91. return unpackRGBToNormal( texture2D( tNormal, screenPosition ).xyz );
  92. #else
  93. return normalize( cross( dFdx( viewPosition ), dFdy( viewPosition ) ) );
  94. #endif
  95. }
  96. float scaleDividedByCameraFar;
  97. float minResolutionMultipliedByCameraFar;
  98. float getOcclusion( const in vec3 centerViewPosition, const in vec3 centerViewNormal, const in vec3 sampleViewPosition ) {
  99. vec3 viewDelta = sampleViewPosition - centerViewPosition;
  100. float viewDistance = length( viewDelta );
  101. float scaledScreenDistance = scaleDividedByCameraFar * viewDistance;
  102. return max(0.0, (dot(centerViewNormal, viewDelta) - minResolutionMultipliedByCameraFar) / scaledScreenDistance - bias) / (1.0 + pow2( scaledScreenDistance ) );
  103. }
  104. // moving costly divides into consts
  105. const float ANGLE_STEP = PI2 * float( NUM_RINGS ) / float( NUM_SAMPLES );
  106. const float INV_NUM_SAMPLES = 1.0 / float( NUM_SAMPLES );
  107. float getAmbientOcclusion( const in vec3 centerViewPosition ) {
  108. // precompute some variables require in getOcclusion.
  109. scaleDividedByCameraFar = scale / cameraFar;
  110. minResolutionMultipliedByCameraFar = minResolution * cameraFar;
  111. vec3 centerViewNormal = getViewNormal( centerViewPosition, vUv );
  112. // jsfiddle that shows sample pattern: https://jsfiddle.net/a16ff1p7/
  113. float angle = rand( vUv + randomSeed ) * PI2;
  114. vec2 radius = vec2( kernelRadius * INV_NUM_SAMPLES ) / size;
  115. vec2 radiusStep = radius;
  116. float occlusionSum = 0.0;
  117. float weightSum = 0.0;
  118. for( int i = 0; i < NUM_SAMPLES; i ++ ) {
  119. vec2 sampleUv = vUv + vec2( cos( angle ), sin( angle ) ) * radius;
  120. radius += radiusStep;
  121. angle += ANGLE_STEP;
  122. float sampleDepth = getDepth( sampleUv );
  123. if( sampleDepth >= ( 1.0 - EPSILON ) ) {
  124. continue;
  125. }
  126. float sampleViewZ = getViewZ( sampleDepth );
  127. vec3 sampleViewPosition = getViewPosition( sampleUv, sampleDepth, sampleViewZ );
  128. occlusionSum += getOcclusion( centerViewPosition, centerViewNormal, sampleViewPosition );
  129. weightSum += 1.0;
  130. }
  131. if( weightSum == 0.0 ) discard;
  132. return occlusionSum * ( intensity / weightSum );
  133. }
  134. void main() {
  135. float centerDepth = getDepth( vUv );
  136. if( centerDepth >= ( 1.0 - EPSILON ) ) {
  137. discard;
  138. }
  139. float centerViewZ = getViewZ( centerDepth );
  140. vec3 viewPosition = getViewPosition( vUv, centerDepth, centerViewZ );
  141. float ambientOcclusion = getAmbientOcclusion( viewPosition );
  142. gl_FragColor = getDefaultColor( vUv );
  143. gl_FragColor.xyz *= 1.0 - ambientOcclusion;
  144. }`
  145. };
  146. export { SAOShader };