HTMLCanvasElement.captureStream()

Experimental

これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

HTMLCanvasElement.captureStream() メソッドは、canvas の前面をリアルタイムにキャプチャした動画を CanvasCaptureMediaStream (en-US) として返すメソッドです。

構文

MediaStream = canvas.captureStream(frameRate);

引数

frameRate 省略可: キャプチャする際のフレームレートを倍精度浮動小数点数で指定します。指定しなかった場合、canvas が変化するたびにフレームが新しくキャプチャされます。0 を指定した場合、フレームが 1 枚だけキャプチャされます。

戻り値

MediaStream オブジェクトへの参照を返します。

使用例

// キャプチャしたい canvas 要素を取得
var canvasElt = document.querySelector('canvas');

// ストリームの取得
var stream = canvasElt.captureStream(25); // 25 FPS

// 取得したストリームに対して何らかの処理を行う
// 例：RTCPeerConnection を使って別のコンピュータに送信
// ここで pc は既に生成された RTCPeerConnection オブジェクト
pc.addStream(stream);

仕様

仕様書	策定状況	備考
Media Capture from DOM Elements HTMLCanvasElement.captureStream() の定義	草案	初期定義

ブラウザ実装状況

BCD tables only load in the browser

HTMLCanvasElement.captureStream()

Experimental

構文

引数

戻り値

使用例

仕様

ブラウザ実装状況

関連情報