BloomPass.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. /**
  2. * @author alteredq / http://alteredqualia.com/
  3. */
  4. import {
  5. AdditiveBlending,
  6. LinearFilter,
  7. RGBAFormat,
  8. ShaderMaterial,
  9. UniformsUtils,
  10. Vector2,
  11. WebGLRenderTarget
  12. } from "../../../build/three.module.js";
  13. import { Pass } from "../postprocessing/Pass.js";
  14. import { CopyShader } from "../shaders/CopyShader.js";
  15. import { ConvolutionShader } from "../shaders/ConvolutionShader.js";
  16. var BloomPass = function ( strength, kernelSize, sigma, resolution ) {
  17. Pass.call( this );
  18. strength = ( strength !== undefined ) ? strength : 1;
  19. kernelSize = ( kernelSize !== undefined ) ? kernelSize : 25;
  20. sigma = ( sigma !== undefined ) ? sigma : 4.0;
  21. resolution = ( resolution !== undefined ) ? resolution : 256;
  22. // render targets
  23. var pars = { minFilter: LinearFilter, magFilter: LinearFilter, format: RGBAFormat };
  24. this.renderTargetX = new WebGLRenderTarget( resolution, resolution, pars );
  25. this.renderTargetX.texture.name = "BloomPass.x";
  26. this.renderTargetY = new WebGLRenderTarget( resolution, resolution, pars );
  27. this.renderTargetY.texture.name = "BloomPass.y";
  28. // copy material
  29. if ( CopyShader === undefined )
  30. console.error( "BloomPass relies on CopyShader" );
  31. var copyShader = CopyShader;
  32. this.copyUniforms = UniformsUtils.clone( copyShader.uniforms );
  33. this.copyUniforms[ "opacity" ].value = strength;
  34. this.materialCopy = new ShaderMaterial( {
  35. uniforms: this.copyUniforms,
  36. vertexShader: copyShader.vertexShader,
  37. fragmentShader: copyShader.fragmentShader,
  38. blending: AdditiveBlending,
  39. transparent: true
  40. } );
  41. // convolution material
  42. if ( ConvolutionShader === undefined )
  43. console.error( "BloomPass relies on ConvolutionShader" );
  44. var convolutionShader = ConvolutionShader;
  45. this.convolutionUniforms = UniformsUtils.clone( convolutionShader.uniforms );
  46. this.convolutionUniforms[ "uImageIncrement" ].value = BloomPass.blurX;
  47. this.convolutionUniforms[ "cKernel" ].value = ConvolutionShader.buildKernel( sigma );
  48. this.materialConvolution = new ShaderMaterial( {
  49. uniforms: this.convolutionUniforms,
  50. vertexShader: convolutionShader.vertexShader,
  51. fragmentShader: convolutionShader.fragmentShader,
  52. defines: {
  53. "KERNEL_SIZE_FLOAT": kernelSize.toFixed( 1 ),
  54. "KERNEL_SIZE_INT": kernelSize.toFixed( 0 )
  55. }
  56. } );
  57. this.needsSwap = false;
  58. this.fsQuad = new Pass.FullScreenQuad( null );
  59. };
  60. BloomPass.prototype = Object.assign( Object.create( Pass.prototype ), {
  61. constructor: BloomPass,
  62. render: function ( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) {
  63. if ( maskActive ) renderer.state.buffers.stencil.setTest( false );
  64. // Render quad with blured scene into texture (convolution pass 1)
  65. this.fsQuad.material = this.materialConvolution;
  66. this.convolutionUniforms[ "tDiffuse" ].value = readBuffer.texture;
  67. this.convolutionUniforms[ "uImageIncrement" ].value = BloomPass.blurX;
  68. renderer.setRenderTarget( this.renderTargetX );
  69. renderer.clear();
  70. this.fsQuad.render( renderer );
  71. // Render quad with blured scene into texture (convolution pass 2)
  72. this.convolutionUniforms[ "tDiffuse" ].value = this.renderTargetX.texture;
  73. this.convolutionUniforms[ "uImageIncrement" ].value = BloomPass.blurY;
  74. renderer.setRenderTarget( this.renderTargetY );
  75. renderer.clear();
  76. this.fsQuad.render( renderer );
  77. // Render original scene with superimposed blur to texture
  78. this.fsQuad.material = this.materialCopy;
  79. this.copyUniforms[ "tDiffuse" ].value = this.renderTargetY.texture;
  80. if ( maskActive ) renderer.state.buffers.stencil.setTest( true );
  81. renderer.setRenderTarget( readBuffer );
  82. if ( this.clear ) renderer.clear();
  83. this.fsQuad.render( renderer );
  84. }
  85. } );
  86. BloomPass.blurX = new Vector2( 0.001953125, 0.0 );
  87. BloomPass.blurY = new Vector2( 0.0, 0.001953125 );
  88. export { BloomPass };