3

HTML5 WebGL に対応していないブラウザで、HTML5 WebGL 動画の再生を動画（音声含む）で記録することはできますか？たとえば、SeriouslyJS (http://seriouslyjs.org/) のものを、ほとんどのブラウザー/デバイスで受け入れられる形式で、バックエンドに記録することは可能でしょうか?

私は多くのバックエンド作業を行ってきましたが、バックエンド GUI に関連するものは何もありませんでした。

4

2 に答える 2

0

スクリーンキャプチャソフトウェア（ScreenFlowなど）を使用して1つ以上の静的ビデオを録画し、それをビデオとして有効になっていないブラウザに表示することができます。JavaScript側では、ビデオに「フォールバック」する必要があります。擬似コードが続きます：

var canvas = document.getElementByID('webgl-canvas');
var webgl = canvas.getContext("experimental-webgl");
if (!webgl) {
  /*
    create a <video> element and replace the <canvas>
    tag with it. Or, have the <video> tag already
    created and hidden with CSS, and display it at this
    time.
  */
} else {
  /*
    Proceed with the interactive, WebGL-enabled version.
  */
}

ただし、ビデオは明らかにテクノロジーによって制限されます。これは、事前に再コード化された非インタラクティブなビデオです。疑似インタラクティブスタイルを実現するには（リンクごとにボタンを押すだけの単純なものである限り）、HTML5メディアAPIを使用して、事前に録画された複数のビデオを動的に切り替えることができますが、これがどれほどうまくいくかはわかりません。帯域幅と同期の問題があるため、実際に動作します。シーケンスを開始する前に、各ビデオに許容可能な量のバッファリングがあることを検証することをお勧めします。

注：上記の提案は、WebGLの代わりに、少なくともHTML5のサポートを前提としています。HTML5をサポートしていない古いブラウザをターゲットにしている場合は、YouTubeビデオのような単純なもので立ち往生している可能性があると思います。

于 2012-07-14T14:50:51.377 に答える
0

この質問への答えは、このブログ投稿にあるかもしれません。作成者は、canvas.toDataURL（）メソッドを使用して、作成した単純なnode.jsインスタンスに各フレームを送信します。node.jsインスタンスは、各フレームをPNGファイルとして保存します。すべてのフレームが保存された後、作者はffmpegのようなものを使用して画像からビデオを生成しているようです。次に、実際のアニメーションの代わりにこのビデオを提供できます。これはかなりの回避策ですが、作成者にとってはうまく機能しているようです。

于 2013-01-11T19:24:55.940 に答える