VR Examples for @angular-three
Enter VR to experience each demo in person or touch/mouse a panel to preview an example or move/pan around.
Point the controller at a panel to activate. Pull the Trigger
on the controller to open/experience the example.
Click the Grab
button to return to the home screen
Pull the trigger to shoot balls
Point at a shape. When highlighted, pull the trigger to move the shape. Release the trigger to stop moving.
The example requires Oculus Quest or equivalent and is still under development
Pull the trigger at a location on the floor. Release the trigger to teleport there.
Hit balls with a baseball bat. Score a point when you hit one in the yellow box.
When controller overlaps a cube, pull the trigger to pickup. Release trigger to drop. Throwing also works.
Use the drumstick to tap keys on the virtual keyboard to enter a message. Press Enter to clear the message.
Use the touchpad to move forward and sideways.
Use the joystick to move forward and sideways.
Point controller at a button to enable/disable that capability on the controller. Capabilites include dragging shapes, teleporting, highlighting and showing the track pointer and controller model
Wall textures show what camera 1 and 2 can see. Grab and move the cameras. Grab and move spot lights.
Pull trigger and move controller to start painting. Use the joystick to increase/decrease the size of the paint brush.
Shows lil-GUI being used in VR. Point at sliders to change shape parameters
Pull triggers on both controllers. Moving controllers closer makes the model smaller. Moving apart ameks the model larger.
Add webvr to ngt-canvas to enable WebVR support
<ngt-canvas webvr (created)="created($event)" [camera]="{ fov: 55, position: [0, 2, 4]}">
Add vr-controller to add left and/or right controllers into a scene. Index 0 is left controller, Index 1 is right controller.
<vr-controller showcontroller trackedpointer [index]="1"></vr-controller>
Add directives to vr-controller to add behaviors depending on needs
- showcontroller - shows controller
- trackedpointer - shows ray to point at stuff
- teleport - teleport to new location on floor. Requires
[floor]
and[room]
<vr-controller teleport showcontroller trackedpointer navhome
[marker]="left.instance.value" [floor]="floor.instance.value">
</vr-controller>
All behaviors can be enabled/disabled at runtime on either controller. The allows behaviors to be switched between controllers if needed.
<vr-controller [showcontroller]="enableshow" [trackedpointer]="enabletracking">
</vr-controller>