VRDisplay: Methode getFrameData()
Deprecated
Avoid using this feature in new projects. Development of the WebVR API halted in favor of WebXR. This feature may be a candidate for removal from web standards or browsers.
Consider using the following features instead: WebXR.
Nicht standardisiert: Diese Funktion ist nicht standardisiert. Wir raten davon ab, nicht-standardisierte Funktionen auf produktiven Webseiten zu verwenden, da sie nur von bestimmten Browsern unterstützt werden und sich in Zukunft ändern oder entfernt werden können. Unter Umständen kann sie jedoch eine geeignete Option sein, wenn es keine standardisierte Alternative gibt.
Die Methode getFrameData() der Schnittstelle VRDisplay nimmt ein VRFrameData-Objekt entgegen und befüllt es mit den Informationen, die zum Rendern des aktuellen Frames erforderlich sind.
Hinweis: Diese Methode war Teil der alten WebVR API. Sie wurde durch die WebXR Device API abgelöst.
Dazu gehören die VRPose sowie die Ansichts- und Projektionsmatrizen für den aktuellen Frame.
Syntax
getFrameData(frameData)
Parameter
frameData-
Das
VRFrameData-Objekt, das befüllt werden soll.
Rückgabewert
Ein boolescher Wert: true wird zurückgegeben, wenn das VRFrameData-Objekt erfolgreich befüllt wurde, andernfalls false.
Beispiele
const frameData = new VRFrameData();
let vrDisplay;
navigator.getVRDisplays().then((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", () => {
vrDisplay.requestPresent([{ source: canvas }]).then(() => {
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
const curFramePose = frameData.pose;
const curPos = curFramePose.position;
const 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
const projectionMatrixLocation = gl.getUniformLocation(
shaderProgram,
"projMatrix",
);
const 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();
}
Hinweis: Den vollständigen Code finden Sie unter raw-webgl-example.
Spezifikationen
Diese Methode war Teil der alten WebVR API, die durch die WebXR Device API abgelöst wurde. Sie wird nicht mehr als Standard weiterentwickelt.
Bis alle Browser die neuen WebXR APIs implementiert haben, empfiehlt es sich, für die Entwicklung browserübergreifend funktionierender WebXR-Anwendungen Frameworks wie A-Frame, Babylon.js oder Three.js oder einen Polyfill zu verwenden. Weitere Informationen finden Sie in Metas Leitfaden Porting from WebVR to WebXR.