Augmented reality

Questions
1

Hello ,

Can i add augmented reality to this exemple : https://www.babylonjs-playground.com/#BCU1XR#0

is augmented reality feasible and stable with babylonjs!

Thanks :)))

2

Pinging our alternate reality overlord @RaananW

3

thanks for the reply @Deltakosh
I do not know if I start with the augmented reality on babylonJs or no ! :confused:

4

Howdy!

AR is supported. But not all AR features. At the moment, you can enter an immersive-ar session and present elements. There are a few limitations to the current implementation, which will change soon:

  1. Pointer down and up is not triggered. So you cannot click buttons ATM.
  2. Plane detection and anchors are not yet supported.

So what you have is your estimated height. The Y axis is your device’s height, and 0 should be the floor (if your device detected it correctly).

To enable AR (working on a simpler implementation for that) use this code:

var xr = await scene.createDefaultXRExperienceAsync({/* options, if you want */})
    // default is vr, change to ar
    xr.enterExitUI["_buttons"][0].sessionMode = "immersive-ar";

This will work in any ar-enabled browser.

A small tip - make sure there is no environment set :slight_smile:

I will soon start working on fully implementing the AR specs so you can interact with the entire scene.

6 Likes
5

thanks for reply :slight_smile:

is there an example with babylon js that contains the notion of augmented reality !!

6

Sure, you can try this:

https://playground.babylonjs.com/#8Y780Y#66

2 Likes
7

sorry @RaananW but this a exemple of augmented reality (AR) !!! :face_with_head_bandage::face_with_thermometer:

8

i might have misunderstood, but didnt you want an example of augmented reality?

9

yes indeed, but sorry I do not see the augmented reality in this example

10

Are you using an AR-enabled browser? Maybe if you can provide a bit more information I will be able to help further

11

sorry if I bother you @RaananW but I tested this example on chrome and android but nothing happens, simple example and does not contain a augmented reality.
I need to develop an example with babylon that allows the augmented reality

12

I am not bothered at all, but I do need some input to work with :slight_smile:

There are AR-enabled browsers, such as chrome canary on android. you also need to enable AR in chrome://flags (along with all related webxr flags). After you do that you will have an AR button on the bottom right corner of your screen and you will be able to see the scene projected in your environment

1 Like
13

thanks a lot for ur help @RaananW :slight_smile:

is this exemple can support AR : https://www.babylonjs-playground.com/#BCU1XR#0

14

With the right modifications you can display this model on the floor, of course.
At the moment you cannot interact with the UI (you cannot press the buttons in AR)
You will also need to remove the background so tat AR will work correctly.

1 Like
15

Great News! If support for current non developer chrome is added it will be great!(8th wall does it i dont know how)

2 Likes
16

Browsers are catching up. The latest chrome on android (78) does have the AR flag in chrome://flag and you can enable it. And it should work :slight_smile:

The only reason I always recommend canary is that it contains all of the latest features, and, best of all, has webvr deprecated.

2 Likes
17

@MouseOverYou @RaananW

I spent 3 days trying to add the augmented reality to this example: https://www.babylonjs-playground.com/#BCU1XR#795 but shame :confused: nothing new :confused: .

I think that animation not supported by AR.

18

want to show us the example where you actually use WebXR? we might be able to help further

19

I don’t use WebXR , I have a project like this exemple and i want to use it with WebAR.

20

There is no WebAR. there is AR using WebXR.

Wannt show us what you tried? A bit of code? So I can understand what you are trying to achieve?