How To

Use PostProcessRenderPipeline


How to use PostProcessRenderPipeline

Post Process Renders pipelines allow you to create a chain of post processes and attach it to a camera. A render pipeline can be managed by enabling and disabling some effects and displaying a specific pass for debugging.

Base Render Pipeline

Renders Pipelines are composed of serval classes.

Class Description
BABYLON.PostProcessRenderPipelineManager Managing all pipelines, allow you to enable or disable an effect, displaying a pass of post process for debugging.
BABYLON.PostProcessRenderPipeline Set of effects that can be ordered.
BABYLON.PostProcessRenderEffect A render effect contains one or more post processes.
BABYLON.PostProcess A render pass which will apply a shader.

Let's play with Render Pipeline

Simple Pipeline

Create pipeline

var standardPipeline = new BABYLON.PostProcessRenderPipeline(engine, "standardPipeline");

Create post processes. Note: Camera parameter is set to when using a pipeline and post process will be enabled when the pipeline is added to the camera.

var blackAndWhite = new BABYLON.BlackAndWhitePostProcess("bw", 1.0, null, null, engine, false);
var horizontalBlur = new BABYLON.BlurPostProcess("hb", new BABYLON.Vector2(1.0, 0), 20, 1.0, null, null, engine, false);

Create an effect with multiple post processes

var blackAndWhiteThenBlur = new BABYLON.PostProcessRenderEffect(engine, "blackAndWhiteThenBlur", function() { return [blackAndWhite, horizontalBlur] });
standardPipeline.addEffect(blackAndWhiteThenBlur);

Add pipeline to the scene's manager and attach to the camera

scene.postProcessRenderPipelineManager.addPipeline(standardPipeline);
scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline("standardPipeline", camera);

Demo -