Is it possible to have a flat background image not being affected by the post processes of the default rendering pipeline? I’ve been doing some tests using a Layer with no luck, as the BG image gets blurred as well: Babylon.js Playground Babylon.js playground is a live editor for Babyl…

You can do it as you did with two cameras but by blending the last post process of the pipeline with the current framebuffer (which contains the layer image at that point) instead of simply replacing the framebuffer with the result of the pipeline (which is the default behaviour). Here’s a PG that …

Hmm. I’m not too sure about the layer object. I can do it with a plane but not with a layer Babylon.js Playground Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes Calling in @Evgeni_Popov on your case. He’s the ultimate master for this.…

Thank you very much @Evgeni_Popov , this solved our issue and also helped us understand more how postprocesses work!

@Evgeni_Popov @sebavan Update! I have found some breakage with recent updates to babylon with this particular technique and we’re experiencing this after updating to ^5.53.1. (^5.21.0 was working for us) See PG example: Babylon.js Playground Babylon.js playground is a live editor for …

A post process texture is not cleared when alpha mode is enabled, that’s why it is not working in your PG. This PR will fix the problem: Post Process: Add a property to clear the buffer even when alpha blending is enabled Babylo…

Thanks, we’ll get this in once the official patch version is released.!

use css .canvas { background:url(/bgc.png); } scene.scene.clearColor = new BABYLON.Color4(0, 0, 0, 0)

@Evgeni_Popov do you have an ETA on when the next patch version will be released?

Not sure if this is approach that fit your needs. But maybe you could do the following. set scene.clearColor to new Color4(0,0,0,0); To make it transparent. set the background of the canvas element to “transparent” create a div or some other HTML element which will exist behind the canvas element,…

We are going to release a new npm version within the hour.

Vignette effect is not working for the whole camera view. Babylon.js Playground Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

Adding a background image that is not affected by the Default Rendering Pipeline post processes

Questions

JoeyKo November 23, 2023, 6:18am 12

Vignette effect is not working for the whole camera view.

Post-Processing not works right in a scene with two cameres

Topic		Replies	Views
Video Background Layer Apply Post Process Questions rendering	8	133	October 7, 2024
How to prevent postprocess effects from affecting background color Questions material , camera , postprocessing	10	1182	January 18, 2024
Post-Processing not works right in a scene with two cameres Questions camera	3	324	January 19, 2024
BabylonJS doesn't seem to respect uiScene.clearColor Bugs	4	518	January 24, 2021
How to combine tone mapping, IBL, and layers? Questions	1	79	February 19, 2025

Adding a background image that is not affected by the Default Rendering Pipeline post processes

Related topics