https://github.com/brianpeiris/three-firstperson-vr-controls
First-person controls for VR based on three.js
https://github.com/brianpeiris/three-firstperson-vr-controls
Last synced: about 1 year ago
JSON representation
First-person controls for VR based on three.js
- Host: GitHub
- URL: https://github.com/brianpeiris/three-firstperson-vr-controls
- Owner: brianpeiris
- License: mit
- Created: 2016-01-10T02:02:08.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2018-03-22T15:30:30.000Z (about 8 years ago)
- Last Synced: 2025-03-15T02:36:36.062Z (over 1 year ago)
- Language: JavaScript
- Size: 24.9 MB
- Stars: 33
- Watchers: 5
- Forks: 5
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# THREE.FirstPersonVRControls
[](https://www.npmjs.com/package/three-firstperson-vr-controls)
First-person keyboard controls for VR based on three.js with look-based movement and "comfort mode" snap turning.
## Controls
- WASD or ↑←↓→
for forward/backward movement and strafing (if enabled).
- Shift to boost movement speed temporarily.
- QE for snap turns.
- RF for vertical movement (if enabled).
- Forward/backward movement is always in the direction that you're looking.
## Usage
$ npm install three-firstperson-vr-controls
```javascript
...
// Create a rig and add the camera to it.
// FirstPersonVRControls will move the rig, instead of moving the camera directly.
// If you don't provide a rig, FirstPersonVRControls will create one for you.
const rig = new THREE.Object3D();
rig.add(camera);
scene.add(rig);
const fpVrControls = new THREE.FirstPersonVRControls(camera, scene, rig);
// Optionally enable vertical movement.
fpVrControls.verticalMovement = true;
// You can also enable strafing, set movementSpeed, snapAngle and boostFactor.
fpVrControls.strafing = true;
...
const clock = new THREE.Clock();
function animate () {
...
// FirstPersonControls requires a time delta.
fpVrControls.update(clock.getDelta());
renderer.render(scene, camera);
}
renderer.animate(animate);
```
## Demo
http://brian.peiris.io/three-firstperson-vr-controls/demo/browser-demo.html

## Credits
Based on code from [THREE.FirstPersonControls](https://github.com/mrdoob/three.js/blob/master/examples/js/controls/FirstPersonControls.js) and its contributors.