search

enkimute / ganja.js

:triangular_ruler: Javascript Geometric Algebra Generator for Javascript, c++, c#, rust, python. (with operator overloading and algebraic literals) -
MIT License
1.5k stars 106 forks source link

Support WebVR #151

Open nileshtrivedi opened 2 years ago

nileshtrivedi commented 2 years ago

Ganja.js should make it possible to view the scene on a VR device. I suspect this involves rendering it for two cameras - one each for left and right eye - and then responding to the head movement by moving the camera positions.

I don't have a suggestion for an API though. Perhaps something like this?

this.graph([
 ...objects
], {grid:false, animate:false, webvr: true})
kungfooman commented 2 years ago

Usually apps print a button "Enter VR" when a headset device is available.

Many web engines (Three/Babylon/PlayCanvas...) support VR already, so the simplest option may be to make the renderer exchangeable/interchangeable. That is usually the prefered way for adding functionality in OOP.

What makes it tricky is probably the different rendering modes... pure GLSL, SVG, WebGL... they would all require their own VR attention to make it work.

I like your idea a lot, it would be nice to drag points with a VR controller and see whats happening while fully visually immersed (probably also helps with concentration).

danbri commented 2 years ago

Yeah, Three.js is the simplest path here I suspect

On Sun, 5 Jun 2022 at 09:07, Hermann Rolfes @.***> wrote:

Usually apps print a button "Enter VR" when a headset device is available.

Many web engines (Three/Babylon/PlayCanvas...) support VR already, so the simplest option may be to make the renderer exchangeable/interchangeable. That is usually the prefered way for adding functionality in OOP.

What makes it tricky is probably the different rendering modes... pure GLSL, SVG, WebGL... they would all require their own VR attention to make it work.

I like your idea a lot, it would be nice to drag points with a VR controller and see whats happening while fully visually immersed (probably also helps with concentration).

— Reply to this email directly, view it on GitHub https://github.com/enkimute/ganja.js/issues/151#issuecomment-1146761164, or unsubscribe https://github.com/notifications/unsubscribe-auth/AABJSGMN6XINZ7ZUR2MVDRLVNRN3XANCNFSM5X347UQQ . You are receiving this because you are subscribed to this thread.Message ID: @.***>

kungfooman commented 2 years ago

The default idiom of this.graph simply can be reimplemented using e.g. ThreeGraph or PlayCanvasGraph. Personally I prefer PlayCanvas, but that just boils down to personal preference.

I made an example of how to use PlayCanvas as a renderer: https://enkimute.github.io/ganja.js/examples/coffeeshop.html#EYCLOff3B

It is using import to import the PlayCanvas engine and the CoffeeShop currently cannot handle that without rerunning the example (just Shift+Enter or press Run button).