WebXR 機器 API
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。
Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
WebXR は、仮想世界(仮想現実、virtual reality、または VR)を提示するために、またはグラフィック画像を現実世界に追加(拡張現実、augmented reality、または AR)するために設計されたハードウェアへの 3D シーンのレンダリングに対応するために、一緒に使用される標準のグループです。 WebXR 機器 API は WebXR 機能セットのコアを実装し、出力機器の選択を管理し、適切なフレームレートで選択した機器に 3D シーンをレンダリングし、入力コントローラーを使用して作成されたモーションベクトルを管理します。
WebXR 互換機器には、モーションと方向の追跡が可能な完全没入型 3D ヘッドセット、フレームを通した現実世界のシーンの上にグラフィックをオーバーレイする眼鏡、カメラで世界を捉えることで現実を拡張し、コンピューターで生成された画像でそのシーンを増強する携帯電話が含まれます。
これらを実現するために、WebXR 機器 API は次の主要な機能を提供します。
- 互換性のある VR または AR 出力機器を見つける。
- 3D シーンを適切なフレームレートで機器にレンダリングする。
- (オプション)出力を 2D ディスプレイにミラーリングする。
- 入力コントロールの動きを表すベクトルを作成する。
最も基本的なレベルでは、それぞれの目の位置を計算し、その位置からシーンをレンダリングすることにより、ユーザーのそれぞれの目の視点からレンダリングするためにシーンに適用するパースペクティブを計算することにより、ユーザーが現在向いている方向を見ているシーンが 3D で提示されます。 これらの 2 つの画像はそれぞれ単一のフレームバッファーにレンダリングされ、左目のレンダリングされた画像は左側に、右目の視点はバッファーの右半分にレンダリングされます。 シーンに対する両目の視点がレンダリングされると、結果のフレームバッファーが WebXR 機器に配信され、ヘッドセットまたは他の適切なディスプレイ機器を通じてユーザーに提示されます。
古い WebVR API は、仮想現実(VR)に対応するためだけに設計されましたが、WebXR はウェブ上の 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 セッションの起動と停止
- WebXR の幾何学と参照空間
- WebXR での空間追跡
- レンダリングと WebXR フレームアニメーションコールバック
- 視点とビューアー: WebXR でのカメラのシミュレーション
- WebXR 設定の照明
- 制限付き参照空間の使用
インタラクティブにする
パフォーマンスとセキュリティ
仕様書
Specification |
---|
WebXR Device API (ソース、 課題、 説明) |
WebXR Anchors Module (ソース、 課題、 説明) |
WebXR Augmented Reality Module (ソース、 課題、 説明) |
WebXR Depth Sensing Module (ソース、 課題、 説明) |
WebXR DOM Overlays Module (ソース、 課題、 説明) |
WebXR Gamepads Module (ソース、 課題、 説明) |
WebXR Hand Input Module (ソース、 課題、 説明) |
WebXR Hit Test Module (ソース、 課題、 説明) |
WebXR Layers API (ソース、 課題、 説明) |
WebXR Lighting Estimation API (ソース、 課題、 説明) |
ブラウザーの互換性
BCD tables only load in the browser
関連情報
- ウェブのグラフィック
- グラフィックの描画
- WebGL API: ウェブ上の 2D および 3D グラフィックスの高速化
- キャンバス API: ウェブのための 2D 描画
- キャンバスチュートリアル