I noticed that the environmentBRDF lut used by babylonjs is different from the existing papers and materials on the Internet. I checked the documentation of filament and checked each channel of the map on the inspector page. I saw someone in the forum had expanded on this topic. As the topic said, if the blue channel is stored sheen BRDF, then the red and green channels should be the same as in the material. But I found that they are indeed different. Can anyone explain it?
filament’ docs DFG visualized:
babylonjs inspector:
R Channel:
G Channel:
It’s the inspector that shows the texture this way, because people expects that (0,0) is the top-left pixel of a texture. In WebGL, though, (0,0) is the bottom-left pixel, and I guess that’s why we show the picture this way in Filament’s documentation.
If you look at it with Spector, you will see the texture has the same orientation than in Filament’s doc, because it displays it the way it has been uploaded:
As you said, webgl usually uses the lower left corner as the origin of texture coordinates. If I need to visualize its texture channels, all I need to do is use 1-uv.y at the v coordinate when sampling, but this is still inconsistent with filament’ docs.
Let me use the approximate solution of UE4 adopted in threejs as an example
You can see that when visualizing its r channel, the map is mostly close to white. But when you look at it in the Babylon inspector and imagine flipping the v coordinates of its texture coordinates, the main color of the image you get is different. Am I missing something?
shadertoy demo:https://www.shadertoy.com/view/tfy3Dw
Here is all the code we use to generate to lut: BabylonjsTextureTools/src/brdf at master · BabylonJS/BabylonjsTextureTools · GitHub
We have several version of the texture uncorrelated, correlated, correlated energie conservation, with/without the sheen lookup, stored in rgbd vs full rgb.
You can use the tool live here: Babylon.js Texture Tools and then dragging a hdr file in followed by clicking on the BRDF link.
The one you are showing looks like the none energy conserving way of storing it ?
2 Likes
I saw there are many types of LUT maps when using the IBL Tool. So the one shown in the filament’ docs is without sheen BRDF, i.e. blue channel is 0, and with none Energie conservation, right? Here is a screenshot(both none Energie conservation)
without Sheen:
with Sheen:
