How to use the postprocessing.RenderPass function in postprocessing

To help you get started, we’ve selected a few postprocessing examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Jeremboo / scribble-lab / scribbles / codevemenr2017 / maskedLines / app.js View on Github external
initPostprocessing() {
    this._composer = new EffectComposer(this.renderer, {
      // stencilBuffer: true,
      // depthTexture: true,
    });

   // *********
   // PASSES
    const renderPass = new RenderPass(this.scene, this.camera);
    // renderPass.renderToScreen = true;
    this._composer.addPass(renderPass);

    const incrustationPass = new IncrustationPass();
    incrustationPass.renderToScreen = true;
    this._composer.addPass(incrustationPass);
  }
github Jeremboo / scribble-lab / scribbles / app.js View on Github external
initPostprocessing() {
    this._composer = new EffectComposer(this._renderer, { depthTexture: true });

    const render = new RenderPass(this.scene, this.camera);
    // render.renderToScreen = true;
    this._composer.addPass(render);

    // const savePass = new SavePass();
    // this._composer.addPass(savePass);


    // BLUR
    // const blurPass = new BlurPass();
    // blurPass.renderToScreen = true;
    // this._composer.addPass(blurPass);

    // horizontal blur shader
    const blurFactor = 3 // make it an even integer
    const blurThreshold = 0.005
    const horizontalBlur = BlurShader.horizontal(blurFactor, blurThreshold);
github Jeremboo / scribble-lab / scribbles / blob&metaballs / organism / app.js View on Github external
import {
  EffectComposer, RenderPass, BlurPass, BloomPass,
} from 'postprocessing';

// https://gitlab.com/Jeremboo/watermelon-sugar/blob/develop/src/js/webgl/index.js
const organism = new Organism();
organism.initGUI();

// Post processing
const clock = new Clock();
const composer = new EffectComposer(rm.renderer, {
  // stencilBuffer: true,
  // depthTexture: true,
});
composer.setSize(window.innerWidth, window.innerHeight);
const renderPass = new RenderPass(rm.scene, rm.renderCamera);
// renderPass.renderToScreen = true;
composer.addPass(renderPass);

const bloomPass = new BloomPass({
  intensity: 5,
  resolution: 5,
  kernelSize: 3,
  distinction: 0.9,
});
bloomPass.renderToScreen = true;
composer.addPass(bloomPass);


// START
function animate() {
  requestAnimationFrame(animate);
github Jeremboo / scribble-lab / scribbles / blob&metaballs / blobPostProcess / app.js View on Github external
initPostprocessing() {
  this._composer = new EffectComposer(this.renderer, {
    // stencilBuffer: true,
    // depthTexture: true,
  });

  // *********
  // PASSES
  const renderPass = new RenderPass(this.scene, this.camera);
  // renderPass.overrideMaterial = new MeshDepthMaterial();
  // renderPass.renderToScreen = true;
  this._composer.addPass(renderPass);


  const metaballPass = new MetaballPass();
  metaballPass.renderToScreen = true;
  this._composer.addPass(metaballPass);

  // const bloomPass = new BloomPass({
  //   intensity: 10,
  //   resolution: 0.9,
  //   kernelSize: 4,
  //   distinction: 20,
  // });
  // bloomPass.renderToScreen = true;
github sneha-belkhale / AI4Animation-js / src / MainScene.js View on Github external
camera.lookAt(new THREE.Vector3(0, -0.2, 3));

  scene.add(camera);
  // set up controls
  if (CONTROL_DEBUG) {
    // eslint-disable-next-line
    const controls = new OrbitControls(camera);
  }

  renderer = new THREE.WebGLRenderer({ antialias: true });
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);

  /** POST PROCESSING ( BLOOM EFFECT ) * */
  composer = new EffectComposer(renderer);
  const renderPass = new RenderPass(scene, camera);

  const bloomPass = new EffectPass(camera, new BloomEffect({
    distinction: 0.1,
  }));
  bloomPass.renderToScreen = true;
  composer.addPass(renderPass);
  composer.addPass(bloomPass);

  /** BASIC SCENE SETUP * */

  // add a point light to follow the dog
  light = new THREE.PointLight(0x6eabfb, 0.7, 8);
  light.position.y = 5;
  scene.add(light);
  bottomLight = new THREE.PointLight(0xff0000, 0.7, 8);
  bottomLight.position.y = -5;
github WhitestormJS / whs.js / packages / w-devkit / effects / EffectsModule.js View on Github external
render(renderToScreen = false) {
        console.log(manager.scene, manager.camera.native);
        const pass = new RenderPass(manager.scene, manager.camera.native);
        pass.renderToScreen = renderToScreen;

        manager.composer.addPass(pass);

        return manager.effects;
      },
      effect(effect, renderToScreen = false) {
github typpo / spacekit / src / Simulation.js View on Github external
const godRaysEffect = new GodRaysEffect(camera, sun, {
      color: 0xfff5f2,
      blur: false,
    });
    */
    //godRaysEffect.dithering = true;

    const bloomEffect = new BloomEffect(this._scene, camera, {
      width: 240,
      height: 240,
      luminanceThreshold: 0.2,
    });
    bloomEffect.inverted = true;
    bloomEffect.blendMode.opacity.value = 2.3;

    const renderPass = new RenderPass(this._scene, camera);
    renderPass.renderToScreen = false;

    const effectPass = new EffectPass(
      camera,
      /*smaaEffect, godRaysEffect*/ bloomEffect,
    );
    effectPass.renderToScreen = true;

    const composer = new EffectComposer(this._renderer);
    composer.addPass(renderPass);
    composer.addPass(effectPass);
    this._composer = composer;
  }