[SOLVED] Material renders incorrectly on Mobile

I’m utilizing hardware-instancing and manipulating shader code on the texture chunks for a windy effect. Does anyone know why it may be appearing without transparency on mobile?

Mobile (Incorrect):

Desktop (Correct):

Material:

Hi @khaelou,

Are you using by any chance alpha to coverage in your material opacity channel?

Thinking you may be running it on an older phone/browser running WebGL1? Alpha to coverage isn’t supported there, and it will explain the result you are seeing. Try increasing your alpha test value.

2 Likes

I did for some reason check this value, I’ll look into it. I’m running on iPhone 12 Pro Max though so I’d figure it would render correctly with latest Chrome iOS.

I’ll try increasing the value and see where that takes me.

1 Like

That solved the issue!

Thanks for this, I often stumble upon your older threads for guidance. It helps.

1 Like

iOS 14 and below only supports WebGL1. iOS 15 supports WebGL2

3 Likes

Ahh, so I suppose Alpha to Coverage isn’t compatible with WebGL 1?

My apologies, in the process of learning WebGL as we speak :sweat_smile:

1 Like

Yes, that’s correct, it’s a WebGL2 feature :innocent:

Luckily after a long time iOS added WebGL2 support on their platform.

1 Like

I see now, honestly love to see the industry adopting WebGL more as time progresses.

1 Like