Add WebXR support - Githubissues

makimenko / angular-template-for-threejs

Angular Template For Three.js

https://makimenko.github.io/angular-template-for-threejs/storybook

MIT License

141 stars 45 forks source link

Add WebXR support #9

Open playground opened 6 years ago

playground commented 6 years ago

Hi, I'm new to three.js, and I like how you're creating interfaces and services for it. I'm trying to port https://codelabs.developers.google.com/codelabs/ar-with-webxr/#6 to angular as way to learn webXR https://github.com/playground/angular-template-for-dummies/tree/web-xr, but I'm having trouble adding model to the scene. Tried to debug it but it's not throwing any errors. Thanks in advance for you help.

To test, clone https://github.com/playground/angular-template-for-dummies/tree/web-xr then "npm install" and "ng build web-xr" and point server to "dist/web-xr"

ComFreek commented 6 years ago

This would be a cool feature indeed!

I think you have to call .render on your Three.js THREE.WebGLRenderer instance after adding a child to the scene. We also do this in our model loaders, which in turn lead to THREE.WebGLRenderer.render being called.

Do you know whether it is possible to test the WebXR API with a PC only, i.e. without a compatible device? I tried to enable the WebXR flags in Chrome Canary's chrome://flags section to no avail: this test site still shows "unsupported browser". I would really like to test out your fork 😄

makimenko commented 6 years ago

The demo on xr.plus looks very nice (checked on iPhone + Safari). Very interesting. Would need to setup a suitable VR development environment first. Agree with ComFreek, the emulator/simulator which will allow to debug on Chrome (ideally without real VR device) could considerably speed-up things.

playground commented 6 years ago

@ComFreek, currently one can only test in Chrome Canary behind a flag on a compatible device. Would be ideal if there is an emulator for testing/debugging. I will give .render a try sometime today. Thanks.

playground commented 6 years ago

@ComFreek with .render it is getting "WebGL: INVALID_FRAMEBUFFER_OPERATION: drawElements: cannot render to a WebVR layer outside of a frame callback"

ComFreek commented 5 years ago

Let's wait for answer at the linked issue. Unfortunately, "cannot render to a WebVR layer outside of a frame callback" also yields no helpful Google results. Do you know what the "frame callback" refers to?

playground commented 5 years ago

@ComFreek actually, if look close enough and zooming in, something did get placed there.