SSR - Decay on distance?

Questions
1

Hello, I’m playing with the example of the Screen Space Reflections (Babylon.js Playground), and it seem I can’t make falloff working, or at least I don’t understand how it work.
I’d like to have the reflection of the cube on the ground that fade out, like in this picture:
three.js - How to achieve a faded reflection? - Stack Overflow

The “faloff” parameter seem to work only on the basis of the camera angle, and it does not provide this kind of effect.
In Three.JS there’s an option “maxDistance” for this.
How can achieve it in BabylonJS ?
Many thanks!

2

Hi hi.

Shoutout to @sebavan for helping me with this.
Looks like there is a way to do this using enviroments. We can set groundMirrorFallOffDistance like so in this demo.

scene.createDefaultEnvironment({
    enableGroundMirror: true,
    groundMirrorFallOffDistance: 4,
});

https://www.babylonjs-playground.com/#VWI383

Also pinging @julien-moreau. He might know more if it is possible to do it using SSR.

3

Hi @DanieleSuppo

I think the snippet @msDestiny14 shared is the one to adopt in your case. SSR are mostly here to add some “realism” in your scene but has some cons like: it cannot reflect what the camera doesn’t sees (back faces, large angles, etc.).

Using the ground mirror will generate a largely better reflection quality

1 Like
4

Many thanks to all, the demo look very nice!
I’ll try soon

1 Like
5

Sorry but I’m totally a newbye, and I can’t understand why my imported GLTF model does not reflect on the ground…
I gave it a material, shouldn’t be enough?
https://www.babylonjs-playground.com/#VWI383#1

6

You should create the mirror after loading and adapt the distance:
https://www.babylonjs-playground.com/#VWI383#2

1 Like
7

My fault. Many thanks!