VRDisplay.cancelAnimationFrame()

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

cancelAnimationFrame() は VRDisplay インターフェイスのメソッドで、 Window.cancelAnimationFrame の特別な実装であり、 VRDisplay.requestAnimationFrame() で登録したコールバックを登録解除します.

メモ: このプロパティは、古い WebVR API の一部でした。 WebXR Device APIに置き換えられました。

構文

cancelAnimationFrame(handle);

引数

handle: 登録解除するための VRDisplay.requestAnimationFrame() の呼び出しで返されたハンドルです。

返値

なし (undefined)。

例

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(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() {
 if(btn.textContent === 'Start VR display') {
 vrDisplay.requestPresent([{ source: canvas }]).then(function() {
 console.log('Presenting to WebVR display');
 // Set the canvas size to the size of the vrDisplay viewport
 var leftEye = vrDisplay.getEyeParameters('left');
 var 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);
 ...
}

メモ: 完全なコードは raw-webgl-example で見ることができます。