Transparent png on Opaque material looks glitchy

So i have some images with transparency but i want to use them on an opaque mesh

after i do material.transparent=false & material.needsUpdate=true

there’s still some depth issue present which is causing some glitches

screenshots:

material.transparent=true + material.needsUpdate=true

and when i make the materials opaque
material.transparent=false + material.needsUpdate=true

opacity is 1 and alphaTest is 0 so they are not causing the issue

is there any step missing to make it behave like a fully opaque material ?

@donmccurdy is this a bug ? should i report in repo ?

Even after i remove the images and material.tranparent=false
, it still has some transparency

So the problem comes when using glb but not when manually creating the planes Geometries w/ textures

Transparency on

Transparency off

trying to setup jsfiddle but it does not seem to load glb from github raw url ,

update: code sandbox loads glb

here’s the demo Transparency issue - CodeSandbox

@orion_prime GLTFLoader will set .depthWrite=false for any materials that are transparent (use alpha blending, in glTF terms) in the GLB. If you’re changing them to transparent=false you will want to set .depthWrite=true I think.

1 Like

yes!
depthWrite fixes this problem

based on this issue 17706

@donmccurdy also when the model loads the transparency looks perfect from all angles , but after i toggle transparency off and then On, i’m seeing this pink planes in the transparent region at certain angles
can that be fixed ?

I’m not sure what’s happening there… it sounds like the material settings are not quite the same before and after the toggle?

1 Like

i was traversing the scene and setting depthWrite and transparency
and the ground projection mesh was also affected , that was the issue i guess

I added a separate group to traverse and it seems fine now :v:

1 Like