3

I'm trying to create my webXR app based on this example: https://threejs.org/examples/#webxr_ar_cones

I wonder how I can overlay the HTML buttons/texts on top of the AR camera view.

I tried to place a button but it disappears as soon as I press the Start AR button and enter the AR camera mode.

How can I do this?

Zack Lee
  • 2,784
  • 6
  • 35
  • 77
  • 4
    It seems you are looking for this: https://chromestatus.com/feature/6048666307526656 – Mugen87 Apr 29 '20 at 18:01
  • 1
    @Mugen87 I tried passing `{optionalFeatures: ["dom-overlay"], domOverlay: {root: document.body}}` as a second parameter of `ARButton.createButton()` function but when I start the app on my android phone, it shows "Unrecognized feature requested: dom-overlay" warning. I also tried using the `https://klausw.github.io/three.js/examples/webvr_lorenzattractor.html` example on my phone, but I get the same warning and I don't see the UI element on top of the camera view. – Zack Lee Apr 29 '20 at 18:49
  • Also, on my android phone's Chrome, there is no such option as `chrome://flags#webxr-ar-dom-overlay` as it says in this post: https://bugs.chromium.org/p/chromium/issues/detail?id=991747 – Zack Lee Apr 29 '20 at 18:53
  • 1
    What version of Chrome are you using? The current latest version 81 is not sufficient. Have you tried it with Chrome Canary or Dev? – Mugen87 Apr 29 '20 at 19:25
  • No, I'm just using the latest version of Chrome. The regular one. So the feature is not ready for Chrome that everybody uses? – Zack Lee Apr 29 '20 at 19:28
  • 2
    Correct. It seems you need at least Chrome 83. – Mugen87 Apr 29 '20 at 19:58
  • 1
    Thank you so much. That answered my questions. I think I'm going to create the GUI using plane geometries for now. – Zack Lee Apr 29 '20 at 20:01

0 Answers0