VRFrameData.leftViewMatrix
Experimental
これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。
leftViewMatrix
は、VRFrameData
インタフェースの読み取り専用プロパティであり、4行4列の行列を表すFloat32Array
返します。この行列は、左目の描画に利用されるビュー変換を表します。
この値は、WebGLのuniformMatrix4fv
関数へ直接渡されるでしょう。
重要: 描画時にアプリケーションがこの行列を使用することを強く薦めます。
文法
var myLVM = vrFrameDataInstance.leftViewMatrix;
値
Float32Array
型のオブジェクトです。
例
var frameData = new VRFrameData();
var vrDisplay;
navigator.getVRDisplays().then(function(displays) {
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() {
drawVRScene();
});
});
});
// WebVR: Draw the scene for the WebVR display.
function drawVRScene() {
// WebVR: Request the next frame of the animation
vrSceneFrame = vrDisplay.requestAnimationFrame(drawVRScene);
// Populate frameData with the data of the next frame to display
vrDisplay.getFrameData(frameData);
// You can get the position, orientation, etc. of the display from the current frame's pose
// curFramePose is a VRPose object
var curFramePose = frameData.pose;
var curPos = curFramePose.position;
var curOrient = curFramePose.orientation;
// Clear the canvas before we start drawing on it.
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
// WebVR: Create the required projection and view matrix locations needed
// for passing into the uniformMatrix4fv methods below
var projectionMatrixLocation = gl.getUniformLocation(shaderProgram, "projMatrix");
var viewMatrixLocation = gl.getUniformLocation(shaderProgram, "viewMatrix");
// WebVR: Render the left eye’s view to the left half of the canvas
gl.viewport(0, 0, canvas.width * 0.5, canvas.height);
gl.uniformMatrix4fv(projectionMatrixLocation, false, frameData.leftProjectionMatrix);
gl.uniformMatrix4fv(viewMatrixLocation, false, frameData.leftViewMatrix);
drawGeometry();
// WebVR: Render the right eye’s view to the right half of the canvas
gl.viewport(canvas.width * 0.5, 0, canvas.width * 0.5, canvas.height);
gl.uniformMatrix4fv(projectionMatrixLocation, false, frameData.rightProjectionMatrix);
gl.uniformMatrix4fv(viewMatrixLocation, false, frameData.rightViewMatrix);
drawGeometry();
function drawGeometry() {
// draw the view for each eye
}
...
// WebVR: Indicate that we are ready to present the rendered frame to the VR display
vrDisplay.submitFrame();
}
Note: You can see this complete code at raw-webgl-example.
仕様
仕様 | 状況 | コメント |
---|---|---|
WebVR 1.1 leftViewMatrix の定義 |
ドラフト | 初版 |
ブラウザ互換性
BCD tables only load in the browser
関連項目
- WebVR API homepage (英語)
- MozVr.com (英語) — デモ、ダウンロード、Mozilla VRチームからのその他のリソース