js-aruco - JavaScriptで実現するAR！ MOONGIFT
HTML5によってJavaScriptからWebカムにアクセスできるようになりました。さらにJavaScriptの処理速度は向上しており、それによって画像をリアルタイムに処理することも問題なくできるようになっています。 この二つによってWebカムから取り込んだ映像をリアルタイム処理するソフトウェアが多数出てきています。今回はその一つ、JavaScriptでAR（拡張現実）を実現するjs-arucoを紹介します。 一例。マーカー部分を認識しています。 デバッグ。様々なフィルタを繰り返すことで必要な情報だけを取り出しています。 実演のデモです。 ARを行う上ではまずマーカーの認識と識別、そしてその後にマーカーの上にオブジェクトを描画する段階になります。現時点でjs-arucoは地球のような簡単なオブジェクトであればマーカーの上に描画できます。 Webベースであればサーバ上のデータと連携させるの
JavaScriptでAR。FLARToolKitをJavaScriptへ移植·JSARToolKit MOONGIFT
JSARToolKitはFlash用ARライブラリFLARToolKitをJavaScriptに移植したライブラリになります。 マーカーを使ったARというとマーカーを認識するカメラが必要になりますが、HTML5ではWebカムのAPIはまだ一般的ではありません。そのためFlashを使うのですが、有名なものとしてはFLARToolKitがあります。そんなFLARToolKitをJavaScriptにポートしたのがJSARToolKitになります。 左側が解析前の動画。中央が認識状況、右側がARを反映した処理になります。 こちらも左側が解析前。解析後はマーカーの上に赤いマークが表示されています。 デモ。マーカーの上にFlickrの画像を反映しています。紙を動かしてもきちんと追従するのでまるで紙に写真が描かれているかのようです。 こちらは面白い。物体がマーカーの上でバウンドしています。マーカーに接
「crocro.jscam」ライブラリの使い方 ――JavaScriptでWebカメラの画像やマーカー情報を取得するライブラリ
はじめに いつもは「創活ノート」でマンガを描いている柳井です。その裏ではゴリゴリとコードを書いています。 今回公開したライブラリ「crocro.jscam」は、Webカメラの情報を取得したり、マーカー情報を取得したりするためのライブラリです。 簡単な設定で「2値化」「ラベリング」「マーカーの取得」を行えます。また、コールバック設定で「Webカメラの画素データ」や「ラベル情報」「マーカー情報」など、多彩な情報を取得できます。 最新のライブラリやサンプルコード、リファレンスは、下記のサイトで公開されています。ソースコード付きのサンプルを見れば、どういったことが行えるのか、イメージがつかめると思います。 「crocro.jscam」JavaScriptでWebカメラの画像を取得するライブラリ というわけで、どういったことができるのかイメージをつかんでもらうために、キャプチャした画像を掲載します。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Learn web development | web.dev