VRDisplay: Methode cancelAnimationFrame()
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 cancelAnimationFrame() der Schnittstelle VRDisplay ist eine spezielle Implementierung von Window.cancelAnimationFrame. Sie hebt die Registrierung von Callbacks auf, die mit VRDisplay.requestAnimationFrame() registriert wurden.
Hinweis: Diese Methode war Teil der alten WebVR API. Sie wurde durch die WebXR Device API abgelöst.
Syntax
cancelAnimationFrame(handle)
Parameter
handle-
Der von dem Aufruf von
VRDisplay.requestAnimationFrame()zurückgegebene Handle, dessen Registrierung Sie aufheben möchten.
Rückgabewert
Keiner (undefined).
Beispiele
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
drawScene();
// WebVR: Check to see if WebVR is supported
if (navigator.getVRDisplays) {
console.log("WebVR 1.1 supported");
// Then get the displays attached to the computer
navigator.getVRDisplays().then((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", () => {
if (btn.textContent === "Start VR display") {
vrDisplay.requestPresent([{ source: canvas }]).then(() => {
console.log("Presenting to WebVR display");
// Set the canvas size to the size of the vrDisplay viewport
const leftEye = vrDisplay.getEyeParameters("left");
const rightEye = vrDisplay.getEyeParameters("right");
canvas.width =
Math.max(leftEye.renderWidth, rightEye.renderWidth) * 2;
canvas.height = Math.max(
leftEye.renderHeight,
rightEye.renderHeight,
);
// stop the normal presentation, and start the vr presentation
window.cancelAnimationFrame(normalSceneFrame);
drawVRScene();
btn.textContent = "Exit VR display";
});
} else {
vrDisplay.exitPresent();
console.log("Stopped presenting to WebVR display");
btn.textContent = "Start VR display";
// Stop the VR presentation, and start the normal presentation
vrDisplay.cancelAnimationFrame(vrSceneFrame);
drawScene();
}
});
}
});
} else {
info.textContent = "WebVR API not supported by this browser.";
}
function drawVRScene() {
// WebVR: Request the next frame of the animation
vrSceneFrame = vrDisplay.requestAnimationFrame(drawVRScene);
// …
}
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. Es ist nicht mehr vorgesehen, sie zu standardisieren.
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 zur Migration von WebVR zu WebXR.