How to create .env texture file?

I haven’t used Texassemble, but it appears to output an h-cross format cube map, which can be read by Lys but not IBLBaker unless I am missing something. There would need to be a step to convert the h-cross into an equirectangular with the polar coordinate distortion at the top and bottom like this:

Then IBLBaker can read the file and create the precomputed environment without issue.

I was trying to create a dds file from jpg but realized that it was not correct.
However, the HDR source for the skybox texture could not be found.
Therefore, I want to find the HDR source from others.

I will try to find the HDR file from below.


http://www.hdrlabs.com/sibl/archive/

2 Likes

I noticed a gltf-test issue, so I added it as a new issue.

1 Like

I decided to create a DDS file using the following HDR file and IBLBaker. Probably the same as the default texture of IBLBaker.

@PatrickRyan Please let me know if you know.
When IBLBaker saves a texture in DDS format, the following files are generated.
Which DDS file should I use for Babylon.js CubeMap and IBL? Should I use papermillEnvHDR.dds?

No File Name File Size
1 papermillBrdf.dds 1,310,848
2 papermillDiffuseHDR.dds 1,966,208
3 papermillDiffuseMDR.dds 491,648
4 papermillEnvHDR.dds 33,554,624
5 papermillEnvMDR.dds 8,388,752
6 papermillSpecularHDR.dds 33,554,624
7 papermillSpecularMDR.dds 8,388,752

would be the one if I remember correctly.

1 Like

Thank you for teaching me. Let me ask you one more question.
Which is true or false for cubeTexture.gammaSpace? I feel that false is correct, but I am not confident.

image

image

false as it is in linear space :slight_smile:

1 Like

Thank you very much. I have updated the gltf-test sample.
I think that loading became faster and came to be displayed beautifully.

https://rawcdn.githack.com/cx20/gltf-test/fca9823d919ed96dd7798466fe6ad8509be94cd0/examples/babylonjs/index.html?category=tutorialModels&model=BoomBox&scale=80&type=glTF

Please keep in mind it is not the optimal solution with IBL Baker so if it is for a public comparison website I would be greatful if you could share the IBL and we use LYS to convert them.

I do not want ppl thinking our rendering is suboptimal due to this.

@PatrickRyan could help with the conversion.

1 Like

If you can help, please submit a PR to gltf-test repository.

Currently, the textures created with IBLBaker are located below. The .dds files have been converted to .env format via BabylonJS Inspector.

gltf-test/textures/dds/papermillSpecularHDR.dds
gltf-test/textures/env/papermillSpecularHDR.env

@cx20 I just created the pull request with the new environment files. The one thing I will note from the earlier thread is that your environment files seemed to be large weighing in at 33.5MB. This can be avoided by using a 256px per side measure on the cube map that is generated. That is what we are using, which results in an 8MB DDS and the env will be just over 1MB for faster download.

3 Likes

Thanks so much @PatrickRyan at least this way we ll be looking our best which sound like a good idea for public comparisons.

2 Likes

Sorry for the up, but I’m not sure why there isn’t anymore the Generate .env texture button when we’re drag&drop an .hdr environment in the sandbox?

I followed the process written in the doc, the env is modified, but the button does not appear

[edit] mmmh, with a dds from IBLBaker, the button shows up, but I was remembering that this worked also with .hdr, right? if no, doc linked above has to be tweaked

Perhaps I dragged and dropped the DDS file into the Babylon.js sandbox to generate the Env file.
I don’t think you can generate an Env file directly from an HDR file. (Maybe I just don’t know how…)

I do not use the sandbox to make my .env files. There is another BJS tool, which has an 11 way switch for .env generation.
https://www.babylonjs.com/tools/ibl/

You just drag your .hdr, and it generates one. I have been just throwing away the one that gets generated automatically, & clicking to get the low res variant.

The single, Uber tool, Sandbox concept has its limitations. This is a infrequent task. Go with the tool made to do just that. Sawing with a Swiss army knife is torture.

I will be publishing my first XR scene soon, which has a custom .env made from an .hdr rendered in Blender. I just put a camera with panoramic lens inside a sphere & rendered it in Cycles. (Recommend increasing the tile size for speed). Would make for very stripey reflections in general use, but my objects do not make them.

1 Like

Yeah! That’s the tool that I was looking for (actually I had already save it on my bookmarks, but doesn’t remember at all :crazy_face: )

I will update this page to mention this tool: Using An HDR Environment For PBR | Babylon.js Documentation

Page should be updated (and fixed) soon :wink: many fixes, separated by commits by Vinc3r · Pull Request #183 · BabylonJS/Documentation · GitHub

2 Likes