Babylon scene appears OK on PC but black in Quest browser

Hi,

I am stuck with an issue related to scene lighting and would appreciate a hint how to make it work.

I have downloaded a .gltf model from Sketchfab and exported it into a .babylon file via the sandbox. When viewing the model in a playground in Chrome browser on my PC everything looks fine. But when I view the same playground on my Quest 2 the model appears black. So I figure it is some issue with the lighting.

The same happens when I export the model as .glb from the sandbox. Any other mesh that I add to the the scene appears as it should though (I added sphere to the playground as an example).

Here’s the code: https://playground.babylonjs.com/#NRHVI2#12

I’ve had the best results with the hemispheric light. For one particular webXR scene, I set the light very high in the air, then messed around with the rotation until I got what I was looking for. When I disabled that same light in a different scene (and had no other lights active), however, I noticed that all of my “lightmapped” imported objects showed up, but looked messy–and all of the default Babylon cubes and spheres turned black. The hemispheric light gives me exactly what I’m looking for. In fact, the code below is what I used in my “sparking light fixture” demo that I just updated today–somewhere in the demo list in this forum.

            var light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(0, 1000, 5), scene);
            light.rotation = new BABYLON.Vector3(-1, -1, -0.5);

Hm. I just commented out the “createdefaultlight” line and saw the sphere turn black on my PC, while the imported model stayed in full view. I then added the hemispheric light, and the sphere became grey again. It’s strange that the model would turn black on your headset, since the model appears to have baked textures and lighting. I haven’t tried this on the Quest 2 yet, but I’m headed there now.

(Edit: It’s hard to edit the Playground code while in VR, I just discovered, but I added the hemispheric light to it, and the model remained black while the sphere lit up. That tells me it’s probably not the lighting that’s the problem, but there’s something going on with the model and how the XR element is set up. I’m still experimenting with it…)

Ok, I think I narrowed the problem down to the model, but I’m not sure what the issue is there. I took the Playground code, created my own .html page from it on my website, and tested the lighting–both the default and the hemispheric–on the Sketchfab model. Neither one lit it up in VR, although it lit up on my PC. Since it’s a .babylon model, I swapped that one for one of my own .babylon models, created in Blender, and the model lit up.

I thought this would be an easy fix, but now I’m stumped. :grimacing:

Maybe @RaananW would have an idea ?

Hi,

This seems to be related directly to the oculus browser (i.e. WebGL in the oculus browser) and not to XR directly. The only browser that doesn’t display it correctly is the oculus browser. Firefox, chrome, edge, all display the model on Load. TBH I haven’t tried Safari so I can’t say anything about this one.

The issue is not lighting. I’ll continue debugging this, though it is not an easy task, debugging webgl on the oculus browser. I hope to be able to reproduce this on a different browser.

It feels like it might be related to texture support. Or the resolution of the image you are using (which is 8k*8k). Not sure yet. But can you try playing around with the texture on your side? switch for example to a jpg, lower the resolution) Might be worth trying this out.

2 Likes