WebXR multiview with custom shaders issue

Hello wonderful team :smiley:

Today I bring an issue I’ve experienced while trying to enable WebXR multiview in my scene.
The view inside the headset looks really weird, it seems that there’s no alignment of the “eyes” inside VR and the whole space seems to distort with any head rotation.

I’ve narrowed it down to what seems like custom shader code somehow interfering with the view inside the headset (side-effects I’ve seen are objects moving with the headset rotation itself). It triggers when applying the shader material to an object.

Removing either multiview or the shader material restores normal functionality

(The issue can only be seen inside a headset, in my case i can reproduce on a Quest 2)

PG:

Wish you an amazing day!

Hello! There have been a few discussions about this: VR Quest Multiview missing content - Bugs - Babylon.js (babylonjs.com)
Supporting multiview for VR Quest2 with custom PBR NME material - Questions - Babylon.js (babylonjs.com)

2 Likes

About NME, there is even an in progress bounty for this one [Open Bounty] ( $250 ) - Implement Multiview gl extension for node material editor / Documentation · Issue #1 · BitReelCo/BJS-PR-Bounty-Pool · GitHub

I promise I will do it after 6.0 if not hunted before then. I would happily do now but tiiiimmmmmeeeee :slight_smile:

1 Like

Alright, that’s good to hear that it’s already being handled :smiley:

Do you consider custom shaders and NME in the same category here? My example is purely custom shader code

ohhh for custom shader it looks like it is already supported Babylon.js/shaderMaterial.ts at master · sebavan/Babylon.js · GitHub

Sounds like you simply need to add the green section in your vertex shader:

from here Making lines (color shader) work in multiview · BabylonJS/Babylon.js@2f8ef87 · GitHub

Thanks! I’ve tried to implement it, but inside VR (quest 2) I got some initial vertex errors regarding vUV, I’ve fixed this by manually having out vec2 vUV in vertex and in vec2 vUV in fragment.

The VR does not give me any further shader errors, however, the box is simply not showing inside VR

PG:

Maybe @RaananW can help as he implemented this one for the line shader and it looks like it is ok there ?

Of course. I didn’t dive into it yet, let me assign myself here

1 Like

I was sure I answered a LONG time ago. So sorry!
The issue here was a missing semicolon in the shader code so it didn’t compile in multiview. This works:

Babylon.js Playground (babylonjs.com)