初めて記事書きます。
Pepper もくもく会( https://pepper.doorkeeper.jp/events/26221 )の成果。公開するとお伝えしたので、ここに公開しようと思います。
タイトルの通り、カメラ画像をライブでタブレットに表示するサンプルというサンプルを作ってみました。カメラのライブ画像は ALVideoDevice.getImageRemote() で取ってこれるんで、これをタブレットに表示すればいいやと思ったんですが、取ってきた生データをHTML ページに表示させる効率的な方法が見つからず、パフォーマンスに難ありです。
ということで実用という意味では?ですが、こんな感じで ALVideoDevice.getImageRemote() 使えるのねという一つのサンプルと思っていただければ幸いです。
サンプルでは、カメラ画像の取得のリクエスト、処理をすべて HTML ページ内の JavaScript で行っています。ペッパー本体への画像リクエスト、取得に QiMessaging API を使っています。
QiMessaging API を使って ALVideoDevice.getImageRemote() を呼び出すと、R,G,B の並びでのバイト配列が Base64 でエンコードされて JavaScript 側に渡されます。ここまではまあいい感じなんですが、Base64 でエンコードされた生画像データをどうタブレットに表示させればいいのか、、、イマイチわかりませんでした。
で取った方法は base64 をデコードして、1ピクセルずつ ImageData オブジェクトにセット。一応動いているみたいですが、遅い、、。 0.5 FPS というところでしょうか、、、
images.src = "data:image/bmp;base64," + base64でデコードされた画像データ
みたいにできれば素敵なんですが、、、raw 画像に対応した MIME タイプがあるのかなど調べきれずです。
Choregrapheプロジェクト github に公開しました。
https://github.com/tkawata1025/CameraToTablet