Help with AR Portal Spawner – Portal Not Aligning to Wall / Scene Not Rendering (Quest 3)

Hi everyone,
I’m new to Babylon.js and could really use some help with an AR project I’m working on.

I’m trying to build an AR portal spawner, based on this Babylon.js Visual Effects Portal demo.

Instead of placing the portal using the hit ring on the floor, I want my app to:

  • Continuously perform AR HitTests to find vertical wall surfaces
  • Store valid wall hit points
  • Run a loop that:
    1. Waits 3 seconds
    2. Picks a random valid wall hit point
    3. Spawns a portal flush with the wall (floor to ceiling height)
    4. Shows a scene behind the portal (goal: allow scene objects to enter the room through it)
    5. Waits 10 seconds
    6. Removes the portal with a vertical wipe animation (this part works)
    7. Repeats

Current Issues:

  • The portal is spawning perpendicular to the wall instead of flush with it
  • The occlusion mask doesn’t work
  • The scene behind the portal doesn’t appear at all

I’m testing on the Meta Quest 3 using WebXR. Any help or suggestions would be greatly appreciated!

My Code:

:link: Playground Link

Reference Example:

:link: Portal Demo Playground

Thanks in advance! :folded_hands:

1 Like

@RaananW

1 Like

Hey @aribornstein , let’s fix that :slight_smile:
Saw the PM, we’ll take it from there