I am running the Three.JS open-source web editor (the source code is here) for my project, and modified it so it works as a standalone. I have configured the editor to satisfy my needs but now I wish to implement augmented reality. For that I'm adding an ARButton
using the following code:
window.editor.renderer.xr.enabled = true;
const arButton = ARButton.createButton(window.editor.renderer);
document.body.appendChild(arButton);
Where window.editor.renderer
is the project renderer. The problem is that when I click START AR
, I'm sent on an empty AR playground even though I have added objects.
So I thought: maybe I'm not using the right renderer instance?
WebGLRenderer instances are created multiple times across the editor source code, but by testing each of them I believe the only one which truly matters is the instance created in Sidebar.Project.Renderer.js
. I added, at the bottom of the createRenderer
function, this line:
window.editor.renderer = currentRenderer;
Again, however, when I click START AR
an empty scene pops-up. I also tried it on my phone (I usually use the WebXR API Emulator by Mozilla) and it's the same.
I don't understand and on top of that I can't find a minimal reproductible example. Every small test I do outside of the Three.JS editor works flawlessly.
from Augmented reality (AR) into the three.js editor shows an empty scene
No comments:
Post a Comment