質問: 個人でWebサービスを作ろうとしているんですが、 カメラで撮影した動画に、現在地点の文字とゲームの音楽を入れたいのです。 ですが、(僕の調べ方が悪いのかもですが)調べてもどのような処理にすれば、サイト上で動画を作成し自動で編集すればいいのか全く分かりません。 ですので、そのような処理がJavaScript(ライブラリはjQuery)で出来るならどのような機能とかで実装できるかを教えて下さい。 お願いします。
回答: ##### できること * ウェブカメラを画面に出力 `navigator.mediaDevices.getUserMedia` * 出力した内容に画像や文字を上書き `HTML5 Canvas` ##### 微妙なこと * 長い動画の記憶 ブラウザ上で使用できるストレージには制限があります。動画のような大きいデータは、扱いに困るでしょう。 * エンコード Webカメラから出力される動画を保存することは可能ですが、よくある`.mp4`や`.webm`などの見慣れた形に変換するのは現時点では難しいでしょう。 JSで動くエンコーダなどもあるようですが...。 可能か不可能かで言えば可能ではありますが、技術的な障壁があるのは確かです。視点を変えて、ブラウザ上だけではなくサーバを用意し、Webカメラの内容を送信して動画ファイルとして返却する、などの回避方法はあります。 ##### **EDIT** ウェブカメラで写真を撮ってその写真に現在地の文字をウェブ上で合成するなどは可能か? 可能です。 * ウェブカメラの画像を取得 `navigator.mediaDevices.getUserMedia` * 位置情報の取得 `Geolocation API` * 画像に文字合成 `HTML5 Canvas` 補足 質問者さんは`jQuery`の使用を前提としているようですが、`jQuery`はJSの世界ではすでに古く、上の機能を`jQuery`を通して使用することはできません。それに、これらの機能をそのままの`JavaScript`で利用するのはそれほど難しくありません。