Reflection Only Material?

Questions
1

So how hard would it be to make a reflection only material?

Something just like the shadow only material, but in this case anywhere that is not an object being reflected it will be discarded to the scenes clearColor.

I could script up a custom Shader to do this, but was hoping there might be a cool trick to pull it off.

2

the way material works should give you a pretty accurate one with a StandardMaterial with only reflection setup (like with disableLightning turned on)

3

I have a transparent clearColor, so now the ground material shows black.

I have tried even setting the opacityTexture and still no luck.

Before I add anything to the reflectionList everything is A ok, but then as soon as a model starts rendering to the reflection the entire ground plane just ignore its alpha. toggle the visibility of the mesh in the reflection list and bam the ground plane goes transparent again.

Its kinda screwy.

Ill maybe have to make a pg.

1 Like
4

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

Without the opacityTexture
and then this with:
https://www.babylonjs-playground.com/#KPXWT0#1

Its super close I feel like, but still off. The ground plane becomes more or less transparent the farther or closer you get. The lighting disabled just makes the ground plane black on with the weird fade.

5

https://www.babylonjs-playground.com/#KPXWT0#4

Really really close but the mirror disappears or something.

https://www.babylonjs-playground.com/#KPXWT0#5
I think no matter what Ill have to write a custom shader here.

Need to have a opacityTexture that samples like a mirrorTexture as far as its space is concerned.

https://www.babylonjs-playground.com/#1YAIO7#112 Its gotta be related to the fact that the reflection texture fills in black for the transparent clearColor.

6

https://www.babylonjs-playground.com/#KPXWT0#7

This is soooo close, but there is some really weird behavior from the camera distance and stuff.

I am assuming all this is because the reflection material sees Color4(0,0,0,0) as black and not transparent.

@Evgeni_Popov is this something that could be whipped up in the nme? Basically need a planar reflection on a ground plane to take alpha in the reflection into account I think. Maybe there is a simpler way to do this?

End goal is to have a fixed gradient in the background of the scene that does not move, preferably a css gradient in the parentNode behind the scene, that has the reflections on it.

7

The alpha component of the reflection texture sampling is not used in the standard material. You can take it into account by doing something like:

mirrorMaterial.Fragment_Before_FragColor(`
    color.a *= reflectionColor.a;
`);

in a CustomMaterial.

https://www.babylonjs-playground.com/#KPXWT0#8

You can’t do the same thing within the nme because the ReflectionMap block does not make the alpha component available:
image

I guess it’s not a big deal to add it, so will submit a PR.

1 Like
8

you are my hero.

now why does it disappear when the camera moves?

9

https://www.babylonjs-playground.com/#KPXWT0#9

got it thanks @Evgeni_Popov

10

PR on its way:

2 Likes