Note: This documentation is for the old 0.3.0 version of A-Frame. Check out the documentation for the current 1.2.0 version
The camera component defines from which perspective the user views the scene. It is often paired with controls components that allow input devices to move and rotate the camera.
It is recommended to wrap entities with the camera component within another entity. This allows us to change the position and rotation of the camera without colliding with controls.
A camera situated at the average height of human eye level (1.6 meters).
<a-entity camera="userHeight: 1.6" look-controls></a-entity>
|active||Whether the camera is currently the active camera in a scene with multiple cameras.||true|
|far||Camera frustum far clipping plane.||10000|
|fov||Field of view (in degrees).||80|
|near||Camera frustum near clipping plane.||0.005|
|userHeight||How much height to add to the camera when not in VR mode. The default camera has this set to 1.6 (meters, to represent average eye level.).||0|
|zoom||Zoom factor of the camera.||1|
When not in VR mode,
userHeight translates the camera up to approximate
average height of human eye level. The injected camera has this set to 1.6
(meters). When entering VR, this height offset is removed such that the
absolute position return from the VR headset is used. This is very convenient
for experiences that work both in and out of VR, as well as making experiences
look decent from the monitor as
opposed to clipping the ground if the headset was resting on the ground.
When exiting VR, the camera will restore its rotation to its rotation before it entered VR. This is so when we exit VR, the rotation of the camera is back to normal for monitor display.
active property is toggled, the component will notify the camera
system to change the current camera used by the renderer:
var secondCameraEl = document.querySelector('#second-camera');
To fix entities onto the camera such that they stay within view no matter where the user looks, you can attach those entities as a child of the camera. Use cases might be a heads-up display (HUD).
<a-entity camera look-controls>
Note that you should use HUDs sparingly as they cause irritation and eye strain in VR. Consider integrating menus into the fabric of the world itself. If you do create a HUD, make sure that it is more in the center of the field of view such that the user does not have to strain their eyes to read it.