WebXR 设备 API
WebXR 是一组标准,它们一起用于支持将 3D 场景渲染到旨在呈现虚拟世界(虚拟现实或VR)或将图形图像添加到现实世界(增强现实或AR)的硬件。WebXR 设备 API实现了 WebXR 功能集的核心,管理输出设备的选择,以适当的帧速率将 3D 场景渲染到所选设备,并管理使用输入控制器创建的运动向量。
兼容 WebXR 的设备包括具有运动和方向跟踪的完全沉浸式 3D 头显、在通过镜片透过的现实世界场景之上叠加图形的眼镜,以及通过摄像头捕捉世界并用计算机生成的图像增强该场景的增强现实手持移动电话。
为了实现这些目标,WebXR 设备 API 提供了以下关键功能
- 查找兼容的 VR 或 AR 输出设备
- 以适当的帧速率将 3D 场景渲染到设备
- (可选)将输出镜像到 2D 显示器
- 创建表示输入控件运动的向量
在最基本的层面上,3D 场景的呈现是通过计算要应用于场景的透视来完成的,以便从用户的每只眼睛的视点渲染它,方法是计算每只眼睛的位置并从该位置渲染场景,朝向用户当前面对的方向。这两个图像中的每一个都渲染到一个帧缓冲区中,左眼渲染的图像位于左侧,右眼视点渲染到缓冲区的右侧。一旦场景的两只眼睛的透视图都渲染完成,生成的帧缓冲区就会传递到 WebXR 设备,以便通过用户的头显或其他合适的显示设备呈现给用户。
虽然较旧的WebVR API仅设计用于支持虚拟现实 (VR),但 WebXR 为 Web 上的 VR 和增强现实 (AR) 提供了支持。AR 功能的支持由 WebXR 增强现实模块添加。
典型的 XR 设备可以有 3 或 6 个自由度,并且可能具有或不具有外部位置传感器。
设备还可以包括加速计、气压计或其他传感器,这些传感器用于感知用户在空间中移动、旋转头部或类似操作时的情况。
WebXR 参考文档
初始化
navigator.xr
XRSystem
XRPermissionStatus
Permissions-Policy
:xr-spatial-tracking
会话
帧循环
空间
视图
几何基元
姿态
输入
图层
XRLayer
XRLayerEvent
XRCompositionLayer
XRCubeLayer
XRCylinderLayer
XREquirectLayer
XRProjectionLayer
XRQuadLayer
XRMediaBinding
WebGL 绑定
锚点
深度感知
命中测试
光照估算
指南和教程
以下指南和教程是学习如何理解 WebXR 和底层 3D 和 VR/AR 图形概念的绝佳资源。
规范
规范 |
---|
WebXR 设备 API (源代码, 问题, 说明) |
WebXR 锚点模块 (源代码, 问题, 说明) |
WebXR 增强现实模块 (源代码, 问题, 说明) |
WebXR 深度感知模块 (源代码, 问题, 说明) |
WebXR DOM 叠加层模块 (源代码, 问题, 说明) |
WebXR 游戏手柄模块 (源代码, 问题, 说明) |
WebXR 手部输入模块 (源代码, 问题, 说明) |
WebXR 命中测试模块 (源代码, 问题, 说明) |
WebXR 图层 API (源代码, 问题, 说明) |
WebXR 光照估算 API (源代码, 问题, 说明) |
浏览器兼容性
BCD 表格仅在启用 JavaScript 的浏览器中加载。
另请参阅
- Web 上的图形
- 绘制图形
- WebGL API:Web 上加速的 2D 和 3D 图形
- Canvas API:Web 的 2D 绘制
- Canvas 教程