1. 開発者向けのウェブ技術
  2. Web API
  3. VRLayerInit

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

VRLayerInit

非推奨;: この機能は非推奨になりました。まだ対応しているブラウザーがあるかもしれませんが、すでに関連するウェブ標準から削除されているか、削除の手続き中であるか、互換性のためだけに残されている可能性があります。使用を避け、できれば既存のコードは更新してください。このページの下部にある互換性一覧表を見て判断してください。この機能は突然動作しなくなる可能性があることに注意してください。

VRLayerInit 辞書は WebVR API の辞書で、 VR ディスプレイに表示したいコンテンツレイヤー (HTMLCanvasElement または OffscreenCanvas) を表します。

メモ: このインターフェイスは、古い WebVR API の一部でした。 WebXR Device APIに置き換えられました。

VRLayerInit オブジェクトは VRDisplay.getLayers() メソッドを使用して受ける取り、 VRDisplay.requestPresent() メソッドを使用して表示することができます。

プロパティ

VRLayerInit.leftBounds

VRDisplay によって内容が表示されるキャンバスの左側のテクスチャ境界を定義します。

VRLayerInit.rightBounds

VRDisplay によって内容が表示されるキャンバスの右側のテクスチャ境界を定義します。

VRLayerInit.source

VRDisplay.submitFrame() が呼び出されたときに、 VRDisplay が表示するコンテンツを持つキャンバスを定義します。

js
// currently returns an empty array
var layers = vrDisplay.getLayers();
if(navigator.getVRDisplays) {
 console.log('WebVR 1.1 supported');
 // Then get the displays attached to the computer
 navigator.getVRDisplays().then(function(displays) {
 // If a display is available, use it to present the scene
 if(displays.length > 0) {
 vrDisplay = displays[0];
 console.log('Display found');
 // Starting the presentation when the button is clicked: It can only be called in response to a user gesture
 btn.addEventListener('click', function() {
 vrDisplay.requestPresent([{ source: canvas }]).then(function() {
 console.log('Presenting to WebVR display');
 // Here it returns an array of VRLayerInit objects
 var layers = vrDisplay.getLayers();
 ...
 });
 });
 }
 });
}

VRLayerInit オブジェクトは下記のように見えます。

js
{
 leftBounds : [ ... ],
 rightBounds: [ ... ],
 source: canvasReference
}

メモ: canvasReference<canvas> 要素そのものを指すものであり、キャンバスに関連付けられた WebGL コンテキストを指すわけではありません。他の 2 つのメンバーは配列です。

仕様書

このインターフェイスは、古い WebVR API の一部でしたが、 WebXR Device API に置き換えられました。標準化される予定はありません。

すべてのブラウザーが新しい WebXR API を実装するまで、すべてのブラウザーで動作する WebXR アプリケーションを開発するには、A-FrameBabylon.jsThree.js などのフレームワークを利用したり、ポリフィルを利用したりすると良いでしょう [1]

関連情報

MDN の改良に協力

協力方法を知る

このページは MDN の貢献者によって に最終更新されました。

AltStyle によって変換されたページ (->オリジナル) /