Dies ist eine experimentelle Technologie
Da diese Technologie noch nicht definitiv implementiert wurde, sollte die Browser Kompatibilität beachtet werden. Es ist auch möglich, dass der Syntax in einer späteren Spezifikation noch geändert wird.
WebVR provides support for exposing virtual reality devices — for example head-mounted displays like the Oculus Rift — to web apps, enabling developers to translate position and movement information from the display into movement around a 3D scene. This has numerous very interesting applications, from virtual product tours and interactive training apps to super immersive first person games.
Concepts and usage
Any VR devices attached to your computer will be returned by the Navigator.getVRDevices()
method. This returns an array of objects to represent the attached devices, which inherit from the general VRDevice
object — generally a head mounted display will have two devices — the head mounted display itself, represented by HMDVRDevice
, and a position sensor camera that keeps track of your head position, represented by PositionSensorVRDevice
.
The PositionSensorVRDevice
object contains the getState()
method, which returns a VRPositionState
object — this represents the sensor’s state at a given timestamp, and includes properties containing useful data such as current velocity, acceleration, and orientation, useful for updating the rendering of a scene on each frame according to the movement of the VR head mounted display.
The HMDVRDevice.getEyeParameters()
method returns a VREyeParameters
object, which can be used to return field of view information — how much of the scene the head mounted display can see. The VREyeParameters.currentFieldOfView
returns a VRFieldOfView
object that contains 4 angles describing the current view from a center point. You can also change the field of view using HMDVRDevice.setFieldOfView()
.
Note: To find out more about using these interfaces in your own app, read Using the WebVR API. To learn more about the basic concepts behind VR, read WebVR concepts.
WebVR Interfaces
Navigator.getVRDevices
- Returns a promise that resolves to an array of objects representing the VR devices attached to the computer.
VRDevice
- A generic VR device, includes information such as device IDs and descriptions. Inherited by
HMDVRDevice
andPositionSensorVRDevice
. HMDVRDevice
- Represents a head mounted display, providing access to information about each eye, and the current field of view.
PositionSensorVRDevice
- Represents the position sensor for the VR hardware, allowing access to information such as position and orientation.
VRPositionState
- Represents the position state at a given timestamp (which includes orientation, position, velocity, and acceleration.)
VREyeParameters
- Provides access to all the information required to correctly render a scene for each given eye, including field of view information.
VRFieldOfView
- Represents a field of view defined by 4 different degree values describing the view from a center point.
VRFieldOfViewReadOnly
- Contains the raw definition for the degree value properties required to define a field of view. Inherited by
VRFieldOfView
.
Examples
You can find a number of examples at these Github repos:
- mdn/webvr-tests: Simple demos built to illiustrate basic feature usage.
- MozVR team: More advanced demos, the WebVR spec source, and more!
Specifications
Specification | Status | Comment |
---|---|---|
WebVR | Entwurf | Initial definition |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | Experimental support[1] |
39 (39) disabled by default[2] |
Nicht unterstützt |
Nicht unterstützt |
Nicht unterstützt |
Feature | Android | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android |
---|---|---|---|---|---|---|---|
Basic support | Nicht unterstützt | 39.0 (39) disabled by default[2] |
Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt | Nicht unterstützt |
[1] To find information on Chrome's WebVR implementation status including supporting builds, check out Bringing VR to Chrome by Brandon Jones.
[2] To enable WebVR support in Firefox Nightly/Developer Edition, you can go to about:config and enable the dom.vr*
prefs. A better option however is to install the WebVR Enabler Add-on, which does this for you and sets up other necessary parts of the environment.
See also
- WebVR environment setup
- WebVR concepts
- Using the WebVR API
- MozVr.com — demos, downloads, and other resources from the Mozilla VR team.
- Console Game on Web — a collection of interesting game concept demos, some of which include WebVR.
- threejs-vr-boilerplate — a very useful starter template for writing WebVR apps into.
- Oculus Rift homepage
Methods and properties list
- HMDVRDevice.getEyeParameters()
- HMDVRDevice.setFieldOfView()
- PositionSensorVRDevice.getImmediateState()
- PositionSensorVRDevice.getState()
- PositionSensorVRDevice.resetSensor()
- VRDevice.deviceId
- VRDevice.deviceName
- VRDevice.hardwareUnitId
- VREyeParameters.currentFieldOfView
- VREyeParameters.eyeTranslation
- VREyeParameters.maximumFieldOfView
- VREyeParameters.minimumFieldOfView
- VREyeParameters.recommendedFieldOfView
- VREyeParameters.renderRect
- VRFieldOfView.VRFieldOfView()
- VRFieldOfViewReadOnly.downDegrees
- VRFieldOfViewReadOnly.leftDegrees
- VRFieldOfViewReadOnly.rightDegrees
- VRFieldOfViewReadOnly.upDegrees
- VRPositionState.angularAcceleration
- VRPositionState.angularVelocity
- VRPositionState.hasOrientation
- VRPositionState.hasPosition
- VRPositionState.linearAcceleration
- VRPositionState.linearVelocity
- VRPositionState.orientation
- VRPositionState.position
- VRPositionState.timeStamp
- Navigator.getVRDevices()