title: hand-tracking-controls type: components layout: docs parent_section: components source_code: src/components/hand-tracking-controls.js
Use hand-tracking-controls
to integrate hand tracked input in your application. The component provides a visual representation of the hand and basic gesture recognition. It can be used along tracked controllers (e.g: oculus-touch-controls) for applications requiring multiple input methods. Component is only active when the browser and underlying system starts tracking the user's hands.
<a-entity id="leftHand" hand-tracking-controls="hand: left;"></a-entity> <a-entity id="rightHand" hand-tracking-controls="hand: right;"></a-entity>
Property | Description | Default Value |
---|---|---|
hand | The hand that will be tracked (i.e., right, left). | left |
modelColor | Color of hand material. | white |
modelStyle | Mesh representing the hand or dots matching the joints | mesh |
Event Name | Description |
---|---|
pinchstarted | The pinch gesture has started. World coordinates passed as event detail. |
pinchended | The pinch gesture has ended. World coordinates passed as event detail. |
pinchmoved | The hand moved while making the pinch gesture. Useful for interactions that track the hand while the gesture is engaged. World coordinates passed as event detail. |