Different render results on Android devices

Questions
, , ,
1

Hi everyone,

I’ve got something that seems to be very odd and hard to nail down.
Short intro:

  • I have one gltf model that renders differently on different Android devices.
  • It renders fine on a Galaxy S20 for example but appears totally shiny on a Galaxy S7.
  • It renders fine on iOS
  • It renders shiny on https://gltf-viewer.donmccurdy.com/ but renders fine on https://sandbox.babylonjs.com/ on a Galaxy S7
  • I found in the console output on the Galaxy S7 something about
THREE.WebGLRenderer: EXT_frag_depth extension not supported
THREE.WebGLRenderer: WEBGL_draw_buffers extension not supported
THREE.WebGLRenderer: EXT_shader_texture_lod extension not supported

not sure if that is related.

  • I know that this happens on other Android devices as well. A colleague of mine reproduces that issue on a Galaxy Note 10+5G and Note 9
  • The issue disappears if I remove the normal map from the model. However, if I add another normal map the issue comes back. So it isn’t tied to that specific normal map.
  • It is also not tied to the 3D geometry because if I apply the same material to a different geo I get the same result.

Console output
Console output3360×2100 1.25 MB

DonMcCurdy Viewer
DonMcCurdy Viewer1080×1920 198 KB

Babylon Viewer
Babylon Viewer1080×1920 101 KB

livingRoomCoffeeTable_v1_BOX.glb (1.7 MB)

Enabling backface culling prior to exporting the model from Blender or manually setting

  "materials": [
    {
      "doubleSided": false,

in the gltf seems to be a workaround. The question is why that helps :slight_smile:

2

Issue at GitHub: https://github.com/mrdoob/three.js/issues/15850

The problem is that certain Adreno GPUs do not handle double sided materials correctly. The workaround for this issue is to do:

BufferGeometryUtils.computeTangents(model.geometry);
model.material.vertexTangents = true;

Viewers like Sketchfab expects tangent definitions in assets or these data are
generate based on uv coordinates. three.js does not auto-generate tangents right now but uses shader based solution which unfortunately breaks with certain devices.

2 Likes
3

Thank you @Mugen87 :pray: