Environment has too strong reflection on objects

Strong reflection, for glass mirrors, direct reflection,
The effect is not very good.

This is the effect in Sandbox.PG example:
sandboxExample

image

--------------------------------------------------Divider-------------------------------------------------------------

I placed it in the modelviewer, and the reflection of light is very soft.

image

I want to know how to adjust the bbl to make the reflection softer.

Note: I am using the same environment ball for both of them. The name is neutral. hdr

Hello :slight_smile:

Your sandbox link won’t load on my side.
Did you try to tweek mesh.material.environmentIntensity ?

hi Sorry, it’s possible that the rich text escaped the link. I adjusted it again and the link address can be previewed now.

Ok, as I said I would advice to tweek environmentIntensity on the glass
Material, (which is LEVELS --> Environment in the Inspector)
Screencast from 09-07-2024 11:28:54

Why do other engine not need to be adjusted? Is it because BJS’s rendering algorithm is different

I would say it’s not exactly a matter of algorithm. Rendering is a thing, lighting is another.

Here in the Sandbox there is an Environment by default. Maybe when you do final usage of your mesh you will add another environment with another lighting intensity, maybe you will add some more lights or whatever. Here comparing the default scene (and its lights) of two viewers (BJS Sandbox, and ModelViewer) does not really make sense to me. At least I would say the difference comes from the lights, more than the rendering pipeline :slight_smile:

In both of the above environments, I used the same HDR. I just want to see the difference in effect. That’s why there are doubts

Ah ok, missed that sorry. I thought you was just pushing the .glb file containing meshes alone

adding @bghgary to check if this is not a problem in our gltf loader not taking in account something

There are multiple reasons why Babylon.js sandbox is different. The primary reason is because we don’t follow the glTF spec for alpha coverage because almost everyone is trying to use it for glass. If it’s glass, Babylon’s rendering is more accurate to what should happen. If you want it to behave completely to spec, then you can use 3dcommerce.babylonjs.com. Newer models should use the KHR_materials_transmission to handle glass which should render consistently across implementations.

It is also brighter in Babylon.js because no tone mapping is applied by default whereas ModelViewer has a tone mapper on by default. You can enable it by clicking on Scene in the inspector and enabling the Khronos PBR Neutral tone mapper which is the same as ModelViewer’s default. We are probably going to enable this tone mapper by default in the 3dcommerce mode.

image

In the screenshot below, I also changed the background to white. This should look much closer to ModelViewer’s settings.

5 Likes

Thank you, buddy. Your answer was fantastic.

Should we need to enable PBR Neutral for PBR realistic rendering?

It depends. Emmett, the driver of the PBR Neutral tone mapper, has an article describing the use cases. This is a complex subject and depends on what you are trying to do.

1 Like

Thanks, I’ll go read and learn

After several months, I discovered the reason for the strong reflection of glass: the useRadianceOverAlpha attribute.
For the glass of my car, setting useRadianceOverAlpha to false would appear more normal Of course, other engines such as Threejs and PlanCanvas will not display such strong glass reflections BJS provides more options for adaptation, but familiarity with BJS’s PBRMaterial documentation is necessary to solve the problem.

Another question is why BJS defaults the useRadianceOverAlpha of PBRMaterial to true?

1 Like

Indeed. But I’m not sure having everything in the doc would really help. In the end, nobody would read it (I wouldn’t). The versatility of the engine is an asset but does add complexity towards all what you can do and combine. Typically, in this case, I believe you could have ‘solved’ this high reflection using a number of other approaches and twists. Clone the reflection texture (or env) and change its levels. Part of it might also come from the light. Change directLight intensity. Add an emissiveTexture and change its color and levels
 and likely many others. :dizzy_face:
Though, I would agree with you that (if by any means possible without removing the specificities, versatility and capacity of the engine) we would have a more ‘normalized’ default for I.E. PBR materials, would likely be a good thing (in my opinion). But that’s likely quite a bit of work and a fair chance to face issues that will (again) require some sort of ‘compromise’. :thinking:

cc @sebavan

How often a material is used with transparency in PBR to not represent plastic/glass or a highly reflective surface which normally should use some kind of transmission ? I would think a lot of time but impossible to quantify.

In those case think about any bright reflection on a glass (help signal, tv on window
), you would not be able to see what is behind but only the reflection. This is why the mode is added by default as it is the most common one but I agree it might be hard to discover and I am game for anybody willing to improve the doc and make it more visible.

Using the 3dcommerce site will disable useRadianceOverAlpha so that it conforms to glTF spec. If you want to do this in your own code, you can set transparencyAsCoverage to true in the glTF loader.

Can you send me a reference for this transparent GLTF specification to read