前の記事 :
次の記事 :

FLARToolKitで、アッチの世界の覗き窓への道　1歩目(パノラマ)

このエントリをはてなブックマークに追加このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリをLivedoor Clipに追加このエントリをYahoo!ブックマークに追加このエントリをFC2ブックマークに追加このエントリをNifty Clipに追加このエントリをPOOKMARK. Airlinesに追加このエントリをBuzzurl（バザール）に追加このエントリをBuzzurl（バザール）に追加このエントリをChoixに追加このエントリをnewsingに追加このエントリをkwoutに追加
2008年9月18日 木曜日2:15:04


このブログのとあるエントリに貼られていたニコニコ動画内のとある動画を見て、ちょっと感銘を受けたりした。
で、この動画っぽい事をARToolKit使って出来ると聞き及んだので、ちょっと試してみた。
とは言え、この動画に使われてるモデルは5MBと重いので、まずは習作として、パノラマ表示を使って、マーカの動きにあわせて動くパノラマビューを作ってみた。
そのdemoがこちら。
かなり探り探り作った習作なので、感想やご指摘をいただけると非常に助かります。
これが上手くいったら、次は動画にある奴を目指そう。

写真は、Waffing on Flickr - Photo Sharing!からお借りした。Creative Commonsのようだが、詳細が分からない。ライセンス的にまずそうだったら指摘していただけると助かります。

こちらが、件の動画。

で、こっちがパノラマビューの参考にさせていただいたサイト。
参考と言うか、ぶっちゃけコードを丸々パクッた。

Googleストリートビュー的なパノラマVRをPapervision3Dで実現する企画第三弾、いよいよ今回で最終回です。前回は立方体にパノラマ画像を貼り付けましたが、今回は球面にパノラマ画像を貼り付けてみたいと思います。まずはデモの紹介から。
CubicVRをPapervision3D 2.0で作るPart.03(Sphere編) | ClockMaker Blog


今回のコードは酷すぎて泣ける。
以下に、マーカ位置からパノラマの表示位置を変更するコードを示すが、適当もいいところだ。

PLAIN TEXT
//マーカの中心点の位置を検出し、傾きとする
var square:FLARSquare = this._detector.getSquare();

var Mx:int = Math.max(square.sqvertex[0][0], square.sqvertex[1][0], square.sqvertex[2][0], square.sqvertex[3][0]);
var mx:int = Math.min(square.sqvertex[0][0], square.sqvertex[1][0], square.sqvertex[2][0], square.sqvertex[3][0]);
var My:int = Math.max(square.sqvertex[0][1], square.sqvertex[1][1], square.sqvertex[2][1], square.sqvertex[3][1]);
var my:int = Math.min(square.sqvertex[0][1], square.sqvertex[1][1], square.sqvertex[2][1], square.sqvertex[3][1]);
var center:Point = new Point((Mx + mx)/2, (My+my)/2);

this._view.camera.rotationY = (center.x - this._source.getWidth()/2) / 2;
this._view.camera.rotationX = -(center.y - this._source.getHeight()/2) / 2;

//マーカの大きさから、ズームを判定する
//マーカの大きさは、900?45000なので、ズームが1?5とか6くらいになるよう調節
this._view.camera.zoom = 1 + square.area / 9000;

あと5秒も考えれば、もっと良いコードが出てくる気がする。
取り敢えずやったことは、以下2点。

  • マーカの中心位置を(原始的な方法で)求め、それによってカメラ(PV3Dの)の傾きを適当に変更
  • マーカの大きさから、ズームを適当に変更。マーカの画面内での大きさの最大と最小は、実験で求めたと言う手軽さ

でも絶対、もっと鮮やかな方法があると思う。マーカ検出結果として得られる変換行列を使うとか。
その辺を考えるのを止めてしまった負け犬のコードですよ。

なお、今回のコードはFLARToolKitのサンプルとして、Spark Projectにコミットしておいた。
例えば、メインクラスはこれ：http://www.libspark.org/svn/as3/FLARToolKit/branches/tarotarorg/examples_1_0_0/org/tarotaro/flash/ar/FLARPanoramaSphere.as

誰か修正プリーズって事でヨロシク。

追記：タイトルを「[習作]このFLARパノラマビューはどう？」から変更しました。

多分、これが目標の動画だろ。

コメント (2) »

  1. > Creative Commonsのようだが、詳細が分からない

    思いっきりCC-byなので自由にお使いください。
    詳細は:
    http://creativecommons.org/licenses/by/3.0/deed.ja

    他のパノラマもどうぞよろしく。

    # AR試してみたいけどウエブカムが無い...

    コメント by heiwa4126 — 2008年9月26日 金曜日 @ 0:21:46

  2. >heiwa4126 さん
    コメントありがとうございます。
    安心して使わせていただきます。

    >># AR試してみたいけどウエブカムが無い...
    Webカメラは今後絶対必要ですから、是非買うべきです！

    コメント by 太郎 — 2008年9月26日 金曜日 @ 23:43:12

TrackBack URL :

コメントする

HTML convert time: 0.915 sec.