ParallaxShader.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. // Parallax Occlusion shaders from
  2. // http://sunandblackcat.com/tipFullView.php?topicid=28
  3. // No tangent-space transforms logic based on
  4. // http://mmikkelsen3d.blogspot.sk/2012/02/parallaxpoc-mapping-and-no-tangent.html
  5. THREE.ParallaxShader = {
  6. // Ordered from fastest to best quality.
  7. modes: {
  8. none: 'NO_PARALLAX',
  9. basic: 'USE_BASIC_PARALLAX',
  10. steep: 'USE_STEEP_PARALLAX',
  11. occlusion: 'USE_OCLUSION_PARALLAX', // a.k.a. POM
  12. relief: 'USE_RELIEF_PARALLAX',
  13. },
  14. uniforms: {
  15. "bumpMap": { type: "t", value: null },
  16. "map": { type: "t", value: null },
  17. "parallaxScale": { type: "f", value: null },
  18. "parallaxMinLayers": { type: "f", value: null },
  19. "parallaxMaxLayers": { type: "f", value: null }
  20. },
  21. vertexShader: [
  22. "varying vec2 vUv;",
  23. "varying vec3 vViewPosition;",
  24. "varying vec3 vNormal;",
  25. "void main() {",
  26. "vUv = uv;",
  27. "vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
  28. "vViewPosition = -mvPosition.xyz;",
  29. "vNormal = normalize( normalMatrix * normal );",
  30. "gl_Position = projectionMatrix * mvPosition;",
  31. "}"
  32. ].join( "\n" ),
  33. fragmentShader: [
  34. "uniform sampler2D bumpMap;",
  35. "uniform sampler2D map;",
  36. "uniform float parallaxScale;",
  37. "uniform float parallaxMinLayers;",
  38. "uniform float parallaxMaxLayers;",
  39. "varying vec2 vUv;",
  40. "varying vec3 vViewPosition;",
  41. "varying vec3 vNormal;",
  42. "#ifdef USE_BASIC_PARALLAX",
  43. "vec2 parallaxMap( in vec3 V ) {",
  44. "float initialHeight = texture2D( bumpMap, vUv ).r;",
  45. // No Offset Limitting: messy, floating output at grazing angles.
  46. //"vec2 texCoordOffset = parallaxScale * V.xy / V.z * initialHeight;",
  47. // Offset Limiting
  48. "vec2 texCoordOffset = parallaxScale * V.xy * initialHeight;",
  49. "return vUv - texCoordOffset;",
  50. "}",
  51. "#else",
  52. "vec2 parallaxMap( in vec3 V ) {",
  53. // Determine number of layers from angle between V and N
  54. "float numLayers = mix( parallaxMaxLayers, parallaxMinLayers, abs( dot( vec3( 0.0, 0.0, 1.0 ), V ) ) );",
  55. "float layerHeight = 1.0 / numLayers;",
  56. "float currentLayerHeight = 0.0;",
  57. // Shift of texture coordinates for each iteration
  58. "vec2 dtex = parallaxScale * V.xy / V.z / numLayers;",
  59. "vec2 currentTextureCoords = vUv;",
  60. "float heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;",
  61. // while ( heightFromTexture > currentLayerHeight )
  62. "for ( int i = 0; i == 0; i += 0 ) {",
  63. "if ( heightFromTexture <= currentLayerHeight ) {",
  64. "break;",
  65. "}",
  66. "currentLayerHeight += layerHeight;",
  67. // Shift texture coordinates along vector V
  68. "currentTextureCoords -= dtex;",
  69. "heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;",
  70. "}",
  71. "#ifdef USE_STEEP_PARALLAX",
  72. "return currentTextureCoords;",
  73. "#elif defined( USE_RELIEF_PARALLAX )",
  74. "vec2 deltaTexCoord = dtex / 2.0;",
  75. "float deltaHeight = layerHeight / 2.0;",
  76. // Return to the mid point of previous layer
  77. "currentTextureCoords += deltaTexCoord;",
  78. "currentLayerHeight -= deltaHeight;",
  79. // Binary search to increase precision of Steep Parallax Mapping
  80. "const int numSearches = 5;",
  81. "for ( int i = 0; i < numSearches; i += 1 ) {",
  82. "deltaTexCoord /= 2.0;",
  83. "deltaHeight /= 2.0;",
  84. "heightFromTexture = texture2D( bumpMap, currentTextureCoords ).r;",
  85. // Shift along or against vector V
  86. "if( heightFromTexture > currentLayerHeight ) {", // Below the surface
  87. "currentTextureCoords -= deltaTexCoord;",
  88. "currentLayerHeight += deltaHeight;",
  89. "} else {", // above the surface
  90. "currentTextureCoords += deltaTexCoord;",
  91. "currentLayerHeight -= deltaHeight;",
  92. "}",
  93. "}",
  94. "return currentTextureCoords;",
  95. "#elif defined( USE_OCLUSION_PARALLAX )",
  96. "vec2 prevTCoords = currentTextureCoords + dtex;",
  97. // Heights for linear interpolation
  98. "float nextH = heightFromTexture - currentLayerHeight;",
  99. "float prevH = texture2D( bumpMap, prevTCoords ).r - currentLayerHeight + layerHeight;",
  100. // Proportions for linear interpolation
  101. "float weight = nextH / ( nextH - prevH );",
  102. // Interpolation of texture coordinates
  103. "return prevTCoords * weight + currentTextureCoords * ( 1.0 - weight );",
  104. "#else", // NO_PARALLAX
  105. "return vUv;",
  106. "#endif",
  107. "}",
  108. "#endif",
  109. "vec2 perturbUv( vec3 surfPosition, vec3 surfNormal, vec3 viewPosition ) {",
  110. "vec2 texDx = dFdx( vUv );",
  111. "vec2 texDy = dFdy( vUv );",
  112. "vec3 vSigmaX = dFdx( surfPosition );",
  113. "vec3 vSigmaY = dFdy( surfPosition );",
  114. "vec3 vR1 = cross( vSigmaY, surfNormal );",
  115. "vec3 vR2 = cross( surfNormal, vSigmaX );",
  116. "float fDet = dot( vSigmaX, vR1 );",
  117. "vec2 vProjVscr = ( 1.0 / fDet ) * vec2( dot( vR1, viewPosition ), dot( vR2, viewPosition ) );",
  118. "vec3 vProjVtex;",
  119. "vProjVtex.xy = texDx * vProjVscr.x + texDy * vProjVscr.y;",
  120. "vProjVtex.z = dot( surfNormal, viewPosition );",
  121. "return parallaxMap( vProjVtex );",
  122. "}",
  123. "void main() {",
  124. "vec2 mapUv = perturbUv( -vViewPosition, normalize( vNormal ), normalize( vViewPosition ) );",
  125. "gl_FragColor = texture2D( map, mapUv );",
  126. "}",
  127. ].join( "\n" )
  128. };