Class: RenderPasses

RenderPasses()

List of predefined Render Passes for Post Processing. Parameters required are shown as a warning in the JS console.

Constructor

new RenderPasses()

Source:: RenderPasses.js, line 48

Example

import Points, { RenderPass, RenderPasses } from 'points';
const points = new Points('canvas');

// option 1: along with the RenderPasses pased into `Points.init()`
let renderPasses = [
    new RenderPass(vert1, frag1, compute1),
    new RenderPass(vert2, frag2, compute2)
];

// option 2: calling `points.addRenderPass()` method
points.addRenderPass(RenderPasses.GRAYSCALE);
points.addRenderPass(RenderPasses.CHROMATIC_ABERRATION, { distance: .02 });
points.addRenderPass(RenderPasses.COLOR, { color: [.5, 1, 0, 1], blendAmount: .5 });
points.addRenderPass(RenderPasses.PIXELATE);
points.addRenderPass(RenderPasses.LENS_DISTORTION);
points.addRenderPass(RenderPasses.FILM_GRAIN);
points.addRenderPass(RenderPasses.BLOOM);
points.addRenderPass(RenderPasses.BLUR, { resolution: [100, 100], direction: [.4, 0], radians: 0 });
points.addRenderPass(RenderPasses.WAVES, { scale: .05 });

await points.init(renderPasses);

update();

function update() {
    points.update();
    requestAnimationFrame(update);
}

Members

BLOOM

Apply a bloom RenderPass

Source:: RenderPasses.js, line 90

Example

points.addRenderPass(RenderPasses.BLOOM);

BLUR

Apply a blur RenderPass

Source:: RenderPasses.js, line 96

Example

points.addRenderPass(RenderPasses.BLUR, { resolution: [100, 100], direction: [.4, 0], radians: 0 });

CHROMATIC_ABERRATION

Apply a chromatic aberration RenderPass

Source:: RenderPasses.js, line 66

Example

points.addRenderPass(RenderPasses.CHROMATIC_ABERRATION, { distance: .02 });

COLOR

Apply a color RenderPass

Source:: RenderPasses.js, line 54

Example

points.addRenderPass(RenderPasses.COLOR, { color: [.5, 1, 0, 1], blendAmount: .5 });

FILM_GRAIN

Apply a film grain RenderPass

Source:: RenderPasses.js, line 84

Example

points.addRenderPass(RenderPasses.FILM_GRAIN);

GRAYSCALE

Apply a grayscale RenderPass

Source:: RenderPasses.js, line 60

Example

points.addRenderPass(RenderPasses.GRAYSCALE);

LENS_DISTORTION

Apply a lens distortion RenderPass

Source:: RenderPasses.js, line 78

Example

points.addRenderPass(RenderPasses.LENS_DISTORTION);

PIXELATE

Apply a pixelation RenderPass

Source:: RenderPasses.js, line 72

Example

points.addRenderPass(RenderPasses.PIXELATE);

WAVES

Apply a waives noise RenderPass

Source:: RenderPasses.js, line 102

Example

points.addRenderPass(RenderPasses.WAVES, { scale: .05 });