How to load .exr as env

I’m trying to use .exr files as environment maps, but it doesn’t seem to be working properly. Does the engine support this?

My images are downloaded from here: HDRI: Indoor • Poly Haven

Moreover, I’ve noticed that even when used as a regular texture, the brightness doesn’t seem quite right.

This is a preview image.

Additionally, I found that using:

The converted .env files show that the size of the .env exported from 4K HDR is nearly identical to that from 2K HDR, yet the skybox clarity differs significantly from 4K HDR. Is this due to resolution compression applied by the converter during conversion?

These two playgrounds can be used for comparison.

This is a playground for using .exr as an albedo texture.

Looking at it now

ok the reason is that the exr is NOT a cube texture (it is a simple 2D image at the end of the day). Skybox mode requires 6 faces to apply the reflection.

You need to use FIXED_EQUIRECTANGULAR_MODE:

RenderTargetTexture Water Sphere | Babylon.js Playground

2 Likes

Thank you for your help. Regarding the issue of .exr files displaying overly dark colors, I’ve identified the cause.

Setting useSRGBBuffer to true restores normal color reproduction.

Now, I have one final question: When converting 4K HDR using Texture Tools IBL, does it compress the resolution down to 2K?

HDR:https://playground.babylonjs.com/#064AUB#162
ENV:https://playground.babylonjs.com/#064AUB#158
EXR:https://playground.babylonjs.com/#064AUB#159

I’ve found their environment reflections are also incorrect. The env setting is entirely correct, and HDR reflections are accurate when filtered through HDRFiltering. However, EXR files fail to produce correct reflections, and HDRFiltering cannot be applied to them.

This may be one approach, but I don’t think the resulting lighting is correct.

yes because EXR cannot YET be used for IBL but @sebavan told me he wanted to fix it :wink:

1 Like

Totally, it is a bit more impactful that I thought but I ll definitely do it.

1 Like

This would allow this code to work to load an env texture from an EXR file: const reflectionTexture = new BABYLON.EXRCubeTexture("assets/metro_noord_1k.exr", scene, 512, false, true, false, true);

2 Likes