GLB Not Loading Properly on ThreeJS Editor

Hi All,

I am generating glTF + bin + textures from FBX using Facebook’s FBX2glTF. After that I am compressing textures using pngquant and re-packaging it as a GLB file using gltf-import-export. Now when I try to load the asset on ThreeJS editor, glTF file loads properly – without any quality issues – but its corresponding GLB file is having quality issues.

glTF Render:

Corresponding GLB Render:

The same file loads up fine on donmccurdy GLTF viewer (uses r116) and many other platforms except threeJS editor (using r120) and Google model-viewer (using r120).

Donmccury Viewer Render

I am not sure what has happened between these releases because I remember it used to work fine with older threeJS versions. If anyone knows what has changed in between and how can this be resolved, please help out.

Thanks in advance.

/cc

@Mugen87

I have found the root cause for the issue. https://github.com/mrdoob/three.js/blob/7830fe3423d042b3735498adf2e1c49d0631442c/examples/js/loaders/GLTFLoader.js#L2263 - this check was previously not there for the older verisons, I guess 6 months before. After this check got added, pngquant compressed textures in the bufferView field for GLBs seems to not adhere to the above conditon and the hasAlpha field gets set to False with the compressed textures in the latest ThreeJS releases.

pngquant converts the 24-bit and 32-bit PNG files to 8-bit files – is that the main reason why it is not adhering to the above conditon for alpha channel is something I am not completely sure of, as of now.

If anyone knows what this condition is actually checking against and can let me know then it would be really helpful. Also, if there is any suggestion for compressing PNG textures better than pngquant and tinypng, do let me know.

Thanks

1 Like