This template demonstrates how you can use hand tracking in VR to pick up and drop objects. It uses the Physics and WebXR packages to create a simple but realistic interactive scene.
Although this project will work with controllers, it's better suited and setup to work with tracked hands. There are 2 Physics Actions setup on the Left / Right controller components respectively. These set the event in which the objects should be grabbed and toggled (dropped).
Both controllers also come with a RigidbodyGrabber. This RigidbodyGrabber allows an entity to grab dynamic rigidbodies to move them around. Only one object can be grabbed at a time per grabber. There are editable properties on the RigidbodyGrabber, so be sure to check that out if you start from this template.
Please note: this is a VR template but will also work with Mixed Reality on supported headsets.
If you'd like to add your own grabbable mesh / 3D model, make sure to add a Physics behavior and set the Grabbable property to true.
This project includes a default splash page - a 'launch' screen shown to the user when they first land on your page. It's important for both technical and user experience related reasons. You can customize it in the index.html file.
Rendering Engine
three.js
Supported Browsers
Google Chrome
Magic Leap 2
Meta Quest
Scripting Language
TypeScript