Mesh imported from glb file showing black on android

Questions
1

We have a model of a space ship and it does not seem to be rendering correctly on android devices, with the object appearing unlit (except for emissive colors). It seems to work fine on desktop browser and iPhone 8. Members of my team have tried on 3 different Android devices and all are showing the same issue. I can gather more info on the devices if needed.

I have tried forcing webgl version to 1 and/or using engine.getCaps().highPrecisionShaderSupported = false as mentioned in some other answers, but neither seems to help. In fact, disabling highPrecisionShaderSupported causes the same problem to happen on the iPhone 8, if that is helpful info. PC seems fine either way.

Here is a simple PG link with that loads the model and uses the same lighting as our viewer (though I also tried changing the lighting and it did not seem to help).

https://www.babylonjs-playground.com/#8CRFQW

Any thoughts on how to fix this?

2

Would be amazing to copy the error message you get in the console if any ?

I unfortunately do not have an android phone anymore :frowning: @RaananW do you still have one ?

1 Like
3

Will check it tomorrow

4

@bigb your PG works fine on my old Samsung Galaxy S6 with Chrome.

5

Also worked in Firefox and Samsung Internet (although pretty sure the latter is just a wrapper for Chrome).

6

Here is the console info from one of my team members:

pgerrorinfo
pgerrorinfo1600×1472 324 KB

He has a Mi A2 Lite. Unfortunately, I do not have an android device to try this on myself, so it’s been tricky trying to track this down.

7

@bigb those are some pretty big numbers for light position & intensity etc. Have you tried scaling these values down so that lights are closer to object and don’t need such high intensities etc?

1 Like
8

I did play around with the scales some, thinking maybe those big numbers were causing problems with reduced precision floats. After turning off the high precision shader support (which seems to cause the issue on my iPhone 8), scaling things down didn’t seem to make any difference. Of course, I don’t actually know that turning off high precision shader on my iPhone is the same as what is causing the problem on android, but it does look the same.

Here’s the reduced scale PG I was using:

https://www.babylonjs-playground.com/#T0QB2X#5

9

highPrecisionShaderSupport = false caused issues on my Android. Reverting to true it’s fine.

Instead of scaling model down after load have you tried scaling and applying transformations to mesh before export?

10

Actually @inteja, it seems you were on the right path! I had my android users try with the reduced scales and apparently it works ok now!

https://www.babylonjs-playground.com/#T0QB2X#6

So I guess I will consider this solved (and get our modeler busy re-scaling things), though if anyone has any explanation why this is happening only on some devices, or what sorts of values and limits I should aim for, I would certainly appreciate it. I’m pretty new to all this.

2 Likes
11

Yes it’s interesting and I can’t pretend to understand the technical differences but I did a bit of digging and there does seem to be quite some variation in the way different mobile GPUs handle floating point precision e.g. Mi A2 Lite’s Adreno 506 vs Samsung Galaxy S6’s Mali-T760MP8 even when both support 32bit floating point on paper. See:

12

Most of our android issues (when I say ours I mean the lack of true spec support) seems to be related to a certain class of MALI chipset where we can unfortunately not do a lot on our side to fix :frowning: but we at least now have one more trick in our sleaves.