Fog.js 2.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. import { positionView, positionWorld } from '../accessors/Position.js';
  2. import { smoothstep } from '../math/MathNode.js';
  3. import { Fn, output, vec4 } from '../tsl/TSLBase.js';
  4. /**
  5. * Returns a node that represents the `z` coordinate in view space
  6. * for the current fragment. It's a different representation of the
  7. * default depth value.
  8. *
  9. * This value can be part of a computation that defines how the fog
  10. * density increases when moving away from the camera.
  11. *
  12. * @param {NodeBuilder} builder - The current node builder.
  13. * @return {Node} The viewZ node.
  14. */
  15. function getViewZNode( builder ) {
  16. let viewZ;
  17. const getViewZ = builder.context.getViewZ;
  18. if ( getViewZ !== undefined ) {
  19. viewZ = getViewZ( this );
  20. }
  21. return ( viewZ || positionView.z ).negate();
  22. }
  23. /**
  24. * Constructs a new range factor node.
  25. *
  26. * @tsl
  27. * @function
  28. * @param {Node} near - Defines the near value.
  29. * @param {Node} far - Defines the far value.
  30. */
  31. export const rangeFogFactor = Fn( ( [ near, far ], builder ) => {
  32. const viewZ = getViewZNode( builder );
  33. return smoothstep( near, far, viewZ );
  34. } );
  35. /**
  36. * Represents an exponential squared fog. This type of fog gives
  37. * a clear view near the camera and a faster than exponentially
  38. * densening fog farther from the camera.
  39. *
  40. * @tsl
  41. * @function
  42. * @param {Node} density - Defines the fog density.
  43. */
  44. export const densityFogFactor = Fn( ( [ density ], builder ) => {
  45. const viewZ = getViewZNode( builder );
  46. return density.mul( density, viewZ, viewZ ).negate().exp().oneMinus();
  47. } );
  48. /**
  49. * Constructs a new height fog factor node. This fog factor requires a Y-up coordinate system.
  50. *
  51. * @tsl
  52. * @function
  53. * @param {Node} density - Defines the fog density.
  54. * @param {Node} height - The height threshold in world space. Everything below this y-coordinate is affected by fog.
  55. */
  56. export const exponentialHeightFogFactor = Fn( ( [ density, height ], builder ) => {
  57. const viewZ = getViewZNode( builder );
  58. const distance = height.sub( positionWorld.y ).max( 0 ).toConst();
  59. const m = distance.mul( viewZ ).toConst();
  60. return density.mul( density, m, m ).negate().exp().oneMinus();
  61. } );
  62. /**
  63. * This class can be used to configure a fog for the scene.
  64. * Nodes of this type are assigned to `Scene.fogNode`.
  65. *
  66. * @tsl
  67. * @function
  68. * @param {Node} color - Defines the color of the fog.
  69. * @param {Node} factor - Defines how the fog is factored in the scene.
  70. */
  71. export const fog = Fn( ( [ color, factor ] ) => {
  72. return vec4( factor.toFloat().mix( output.rgb, color.toVec3() ), output.a );
  73. } );
粤ICP备19079148号