cx20 / gltf-test

Testing the glTF Loader and WebGL Library

Home Page:https://cx20.github.io/gltf-test/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Change the texture of CubeMap/IBL used in the test to the same one

cx20 opened this issue · comments

commented

Currently, glft-test uses different cubemap textures for each library.
Use the same texture as much as possible because it is difficult to compare.

No Library CubeTexture IBL(Env map)
1 Three.js skybox/<p|n><x|y|z>.jpg skybox/<p|n><x|y|z>.jpg
2 Babylon.js country.env country.env
3 Cesium N/A N/A
4 ArcGISJSAPI N/A N/A
5 Grimore.js N/A N/A
6 xeogl cloudySkyBox.jpg N/A
7 minimal-gltf-loader skybox/<p|n><x|y|z>.jpg bakedDiffuse_0<1|2|3|4|5|6>.jpg
8 Khronos glTF Loader N/A N/A
9 ClayGL skybox/<p|n><x|y|z>.jpg pisa.hdr
10 Hilo3d skybox/<p|n><x|y|z>.jpg bakedDiffuse_0<1|2|3|4|5|6>.jpg
11 PlayCanvas Helipad_<pos|neg><x|y|z>.png Helipad.dds
12 X3DOM papermillDiffuse.dds papermillDiffuse.dds
13 CZPG.js skybox/<p|n><x|y|z>.jpg bakedDiffuse_0<1|2|3|4|5|6>.jpg
14 GLBoost papermill/environment/environment*.jpg papermill/diffuse/diffuse*.jpg
15 RedCube.js N/A pisa.hdr
16 RedGL skybox/<p|n><x|y|z>.jpg skybox/<p|n><x|y|z>.jpg
17 Ashes N/A helipad/<pos|neg><x|y|z>.hdr
18 Unity skybox/<p|n><x|y|z>.jpg N/A
19 pex pisa.hdr pisa.hdr
20 Filament syferfontein_18d_clear_2k_skybox.ktx syferfontein_18d_clear_2k_ibl.ktx

@cx20 Not only IBL, In these CG pipelines, libraries/engines people have their own policy/thought.
So It's difficult to unify those libraries way to only one.

In my opinion, a realistic solution would be making an automation tool.
This tool gets HDR env image and calls each library's IBL pipeline script, and finally outputs pre-filtered textures for them.

commented

I basically decided to use PaperMill for CubeMap / IBL in gltf-test.
However, I noticed that there were cases where the orientation of the cubemap and the orientation of the model did not match, so I decided to investigate.

Original Image:
http://www.hdrlabs.com/sibl/archive/downloads/PaperMill_Ruins_E.zip
image

The following are the differences in the display results for each library.

image image image
image image image

The following are the test results and comments. Please note that it may be a usage issue, not a library.

Library BoomBox + CubeMap result CubeMap Texture (Spector.js result) Orientation Test result
Three.js image image ❌ Left and right sides of CubeMap texture are reversed
Babylon.js image image ❌ Different orientation
Filament image image ❌ Different orientation
PlayCanvas image image ❌ Different orientation
Rhodonite image image ✅ CubeMap and model orientation match
GLBoost image image ❌ Different orientation
commented

I think the problem with cubemaps in Three.js was fixed in #424.

commented

I think the problem with cubemaps in PlayCanvas was fixed in #512