Transparent PNG image in GLTF appears black?

[mng...@gmail.com]

Dear Forum,

I'm using a model from the DAE embedded in a KMZ, and converted that to a GLTF to be shown on Cesium.

The textures are linked to .jpg and .png files, where the png files are used when transparency is involved.

The transparent part of the PNG image, however, becomes black and I don't know why. Is there a workaround for this, or am I missing some settings when I import the models?

[Rachel Hwang]

Hi there,

Try modifying the gltf file. The value `3042` (BLEND) should be added to the `states` section of the technique:

`"states": {

        "enable": [

            3042,

            2929

        ]

    }`

Hope that helps,

- Rache

[mng...@gmail.com]

That solves the problem! Thanks Rachel!

Actually I see quite a bunch of people do this in the model. Wouldn't it be great if collada2gltf could do that by default? I mean, at least for the .png files.

BTW, where in the source code should I look into if I want that as a default?

[mng...@gmail.com]

Also I found out the problem persists on mobile phones (same for iOS/Android). Don't know where I could look further.

[mng...@gmail.com]

> Also I found out the problem persists on mobile phones (same for iOS/Android). Don't know where I could look further.

Self solved. I followed this one:

https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Apps/SampleData/models/CesiumAir/Cesium_Air.gltf#L755-L772

and copied the code for a "concrete" alpha blending. Turns out it renders well on mobile browsers.

I wonder what's the main thing that makes it work, though.

[br...@studio360tour.com]

Good night everyone.

My name is Bruno, I’m from Brazil and I’m currently developing a new technology based company. We will deal with lots of 3D modeling for 360 views.

I have the same problem as lots of you have been reporting in this topic. In my PNG files, where should be invisible (no color at all), is actually appearing totally black. I’ve read this topic, but when I open my GLTF file, I can’t find this lines you’re talking about. I’m exporting my GLTF file from sketchfab.

I’m wondering if you have any idea of what is happening here, or have any insights on how can I fix this? This is a major issue for us, and I’ve been trying like crazy to fix this so I can move on with the development.

Appreciate any help! Thank you all, have a great one.

[mng...@gmail.com]

I'm not sure about sketchfab, but I'd say it exports to .kmz compressed COLLADA .dae file.
Actually the building model I got is a .kmz file, which is essentially a .zip file with a different suffix to identify itself as a zipped .kml and related files.
What I did is unzip the file (change the suffix of the file and unzip it), and used COLLADA2GLTF to convert into a .gltf file.
(officially released by Cesium. For 64 bit Windows, Linux and MacOS, you can find compiled binaries here: https://github.com/KhronosGroup/glTF/releases)
From there I found the lines that we discussed above. Worth a try I'd say.

Some hint: you might want to use a hard, complete path to point to the .dae file when working with COLLADA2GLTF on a Windows machine (not sure about other OSes). That would make it easier for you to convert it again into .glb files using gltf-pipeline if you're going towards building .b3dm files.

[Sean Lilley]

Hey Bruno, can you post the glTF model you got from sketchfab? It might be a glTF 2.0 model in which case check the alphaMode of the material. It should be "BLEND".

[br...@studio360tour.com]

Hi Sean, mng and everyone,

The app developers switched the gLTF model reading library, now the PNG worked.
But I will send the links of our models in sketchfab as requested.

If possible, I would like to ask some questions ... Does the GLTF format keep all information after it is configured? Like light, and other important settings.
We are using threejs.org/editor to configure and export the file in GLTF, and for testing we use gltf-viewer.donmccurdy.com/ where we just drag the file ready to get a true view of what will be inside our app.

I would like to know if there is any other editor that tells me and that it can be better too

model 1 sketchfab: https://sketchfab.com/models/9de80b54b02d4f72a7d35cf84e75b211
This model the PNG not worked in the new library.

model 2 sketchfab:
https://sketchfab.com/models/67b5051d1b76406d88d39fa2220c9407
And on this model the PNG has worked. If you'd like to see, you can download this model in GLTF, just drop on site gltf-viewer.donmccurdy.com/ (remember you need drop the folder compacted).

And if you think to talk in another social media would be better, we can without problem.
Any doubt, i'm available.

Thanks!

[Sean Lilley]

Thanks for sending the models. It looks like the first model does not set the alphaMode so it default to "OPAQUE". I'm not sure why it appears black though. The second model sets it to "MASK", which is good for leaf textures.

glTF will store anything related to the material, like what colors or textures it has, but won't store lights. I think there is an extension is progress for making that possible though.