Kawanet Blog II

アクセスカウンタ

zoom RSS JSARToolKit - JavaScriptでAR拡張現実(Augmented Reality)

<<   作成日時 : 2009/04/15 04:53   >>

面白い ブログ気持玉 12 / トラックバック 0 / コメント 0

川崎は、リアルデバイスとか、ネットとリアルが繋がるようなユーザ・インターフェース周りの技術に特に関心があるわけですが、リアルな世界を拡張した情報を表示する AR (Augmented Reality) も、新しいインターフェースの形として面白いです。

とりわけ、Adobe MAX で FLAR のデモ があまりに素敵だったので、JavaScript でもやってみました。

JSARTooKit が四角い「マーカー」を認識して、
JavaScript で赤い枠を描画しています。

JavaScript のソースコードは、こんな感じで使います。

<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript" src="jsar.js"></script>
<script type="text/javascript"><!--
var jsar = new JSAR('jsar_here');
jsar.markerFiles = [ 'assets/flarlogo.pat' ];
jsar.drawMarkerRect = true;
jsar.onDetected = function (result) {...};
jsar.init();
jsar.setMarker();
jsar.startLoop();
--></script>

JS だと、コンパイル不要でどしどし試せるのがラクですね。
もうこれで JavaScript でも怖いところナシ!?

⇒ JSARToolKit のデモはこちら

現在のところ、JSAR 自体は、3D 表示には対応していません。
デモ用として、canvas 要素上でのマーカー位置の描画をやっています。
AR≠3D なので、必ずしも 3D インターフェースに拘る必要はないかな。
3D まで含めた AR をするには、gyuqyu さんの 3D エンジン を組み合わせてもらえれば、
JavaScript でも「はちゅねミク」がネギを振るということは周知の事実。

オマケで、カメラ起動後に、マーカーの途中変更もできるようにしています。
マーカーは複数利用可能です。マーカーのパターンデータは、
ARToolKit Marker Generator Online で作成したものが利用可能です。

まだ完成していません。後で仕様変更する可能性もあります。
配布用パッケージも作っていません。
今回は、とりあえず動くところまで。

ゴメンナサイ! ゴメンナサイ!


実際のところ、JSAR は FLAR のラッパーライブラリです。
JavaScript から Flash 用の FLARToolKit を呼び出します。
決して、「もう Flash なんていらない!」なんて思ってません。
JavaScript 単体ではカメラを扱えないので、この処理は実現できません。>_<
ただし、マーカー認識後の線の描画については、JS で描画しています。

ソースコードはそんなに長くないですが、AS3 を書いてみたのは、初めてです。
とりあえず ここ に置いてますが、後で Spark に移動したいところ。
エディタは trick7 に教えてもらった FlashDevelop を使いました。F4 キーが超便利ですね。

AR 楽しい!


saqoosha さんの gihyo.jp の記事 も分かりやすくてオススメです。

リアルなデバイスだとどうしても、多くの人に使ってもらうのが難しいのに対し、
AR はとりあえず Web カメラがついている PC なら、扱えるというのも魅力。
Mac なら、ほとんどの機種でカメラが内蔵されてるんじゃないでしょうか?
Wii リモコン は 3,000 円以上するけど、AR に使うマーカーは印刷するだけなのでタダに近い。

AR は、アメリカの GE のサイト でも使われて、話題になっていました。
デモムービーを見る〜PDFダウンロード〜印刷〜Webカメラ接続〜試すところまで、
結構長い時間(少なくとも10分以上)GE のサイトに滞在・ブランド接触するわけで、
そういったプロモーション・ブランディングとしても成功したコンテンツですよね。
また、試した後に GE のロゴ入りで印刷した紙が手元に残るというも◎ですね。

最後に、FLARToolKit をリリースされた saqooshaさん に大感謝。
FITC 頑張ってください!! 日本スゴいよ!!
FLARToolKit のベースになった Java 版 NyARToolkit のA虎@氏さんにも感謝です。

『JS でも AR を扱える』ようになって、俄然、熱くなってきました!
 

テーマ

関連テーマ 一覧


月別リンク

ブログ気持玉

クリックして気持ちを伝えよう!
ログインしてクリックすれば、自分のブログへのリンクが付きます。
→ログインへ
気持玉数 : 12
面白い 面白い 面白い 面白い
驚いた 驚いた
ナイス ナイス
ガッツ(がんばれ!) ガッツ(がんばれ!)
なるほど(納得、参考になった、ヘー)
かわいい

トラックバック(0件)

タイトル (本文) ブログ名/日時

トラックバック用URL help


自分のブログにトラックバック記事作成(会員用) help

タイトル
本 文

コメント(0件)

内 容 ニックネーム/日時

コメントする help

ニックネーム
本 文
JSARToolKit - JavaScriptでAR拡張現実(Augmented Reality) Kawanet Blog II/BIGLOBEウェブリブログ
文字サイズ:       閉じる