アンケートご協力のお願いgihyo.jpでは,2010年度に向けて豪華プレゼントが当たる読者属性アンケートを実施しております。ご協力ください。

gihyo.jp » WEB+DESIGN STAGE » 特集 » FLARToolKitを使ったAR系Flashの作り方 » 第2回 3Dソフトで作ったオブジェクトを使ってみる

FLARToolKitを使ったAR系Flashの作り方

第2回 3Dソフトで作ったオブジェクトを使ってみる

複雑なオブジェクトを表示する

前回は単純なCubeを表示するだけで少しもおもしろくありませんでしたので,今回は,より複雑なオブジェクトを表示して遊んでみましょう。

複雑なオブジェクトとは,例えばFlash以外の3Dソフトで作ったキャラクターとか,そういうものです。しかし,オブジェクトをマーカー上に表示するといっても全く難しくなく,Papervision3Dの機能だけであっさりできます。

そもそも,FLARToolKitがやっていることは前回もお話したようにカメラ座標の計算のみであり,そこから先はPapervision3Dをいかに組み合わせて使うか,という部分がほとんどで,つまり,ここから先はPapervision3D講座みたいになります。

今回使うデータは,以下になります。

Flashをお持ちの方はflaディレクトリに.flaファイルがあるのでそれをパブリッシュ,Flex Builderを使ってる人はこのzipをそのままFlex ProjectのArchiveファイルとしてimportしてください。

なお,今回も前回使用したものと同じマーカーを使用します。そのため,まだマーカーを作ってない人は,マーカーのPDFファイルを80mm x 80mm(等倍)で印刷しておいてください。

外部データを読み込む

Papervision3Dは基本機能の1つとして,Colladaというデータ形式の3Dオブジェクトを読み込む機能がついています。ColladaとはSony Computer EntertainmentがPlayStation 3の標準データフォーマットとして開発したもので,現在ではKhronos Groupという組織が管理している3Dソフトウェア業界標準の3Dデータフォーマットです。

例えば,フリーの3Dソフト,BlenderでもCollada形式に対応しているので,とりあえずお金をかけずに3Dモデルを作ってみたいという方はBlenderを試してみてください。ちょっとクセがあるけど慣れれば問題ないと思います。

ただし,Colldaのサイトに,Collada対応の3Dソフト一覧という項目がありますが,必ずしもPapervision3Dで使えるColladaを書き出せるとは限らないので,注意してください。

みっくみくにしてやんよ

モデリングの説明から始めると話がそれすぎてしまうため,今回はすでにCollada形式で書き出されたデータを読み込むところから説明します。

まずは,外部データとしてnote.xさんがフリーで配布しているねぎミクColladaファイルを使ってみます。いわゆる「はちゅね」です。

外部データを読み込むコードは以下のようになります。詳細はGihyo2_1a.asを確認してください。

リスト1 外部ファイルの読み込み(Gihyo2_1a.as)

// Gihyo2_1a.as
package {
  
  import flash.display.Sprite;
  
  import org.papervision3d.objects.parsers.DAE;

  [SWF(width=640, height=480, backgroundColor=0x0, frameRate=30)]

  public class Gihyo2_1a extends PV3DARApp {
    
    private var _miku:DAE;
    
    public function Gihyo2_1a() {
      this.init('Data/camera_para.dat', 'Data/flarlogo.pat');
    }
    
    protected override function onInit():void {
      super.onInit();
      
      this._miku = new DAE();
      this._miku.load('negimiku.dae');
      this._baseNode.addChild(this._miku);
    }
  }
}

とても簡単ですね。コードの流れは,前回のSimpleCube.asと同じように,まずはPV3DARAppクラスを継承したGihyo2_1aクラスを作ります。

そして,onInitの中でオブジェクトを作るのですが,今回は外部ファイルを読み込むだけなので,たったの3行です。DAEクラスがColladaファイルを読み込んで表示してくれるクラスです。このクラスのloadメソッドに読み込みたいColladaファイル(.daeという拡張子です)を指定すると,あとは勝手にモデルデータやテクスチャデータを読み込んでくれます。

読み込んだら前回と同じように,_baseNodeにaddChildします。そして,Flash使ってる方はGihyo2_1a.flaをパブリッシュ,Flex Builderを使っている方はGihyo2_1a.asをRunしてください。以下の図のように表示されるはずです。

図1 はちゅねを表示できたけど,サイズが小さいし,下を向いてしまっている

図1 はちゅねを表示できたけど,サイズが小さいし,下を向いてしまっている

そうでした,FLARToolKitの座標系が違うんでしたね。そこで,そのあたりを調整しましょう。それがGihyo2_1b.asです。以下の部分を確認してください。

リスト2 サイズと座標系の調整(Gihyo2_1b.as)

// Gihyo2_1b.as
this._miku = new DAE();
this._miku.load('negimiku.dae');
this._miku.scale = 5;        // 1
this._miku.rotationX = 90;   // 2
this._miku.rotationZ = 90;   // 3
this._miku.z = 9.68721 * 5;  // 4
this._baseNode.addChild(this._miku);

1では,サイズがもう少し大きくなるように調整しています。2と3では,正しい方向に回転させています。4では,Z方向に移動させています。

今回使ったデータは原点がはちゅねのおなかあたりにあるため,そのまま表示してしまうと,マーカーの上に正しく立ってくれません。そこで,ちょうど足がマーカー原点になるように移動させる必要があります。この数字はモデリングデータから調べたものです。実際に自分でモデルを作るときには,原点がマーカー中心だということを考えて作れば,わざわざActionScirptで移動させなくてもよくなります。

さて,Flashを使ってる方はGihyo2_1b.flaをパブリッシュ,Flex Builderを使っている方はGihyo2_1b.asをRunしてください。

図2 はちゅねがきちんと表示された

図2 はちゅねがきちんと表示された

どーん。はちゅね召喚に成功しました!

ね?簡単でしょう?

著者プロフィール

さくーしゃ

大阪のKatamari Inc.っていうWeb屋でFlashやってます。Saqoosha.netでブログ書いてます。新しもの好きで飽きっぽいGeek。

コメント

コメントの記入

パスサポ

多数の情報処理技術者試験対策書籍の発行実績を誇る技術評論社がお届けする,資格試験合格サイト「めざせ! 情報処理試験 パスサポ」が開設されました。

ピックアップ

サクセスストーリーに続く,快適サーバー運用管理のヒント!

データの増大,煩雑な管理,システムダウン,セキュリティなど,迫りくる課題からシステム管理者の負担を軽くするポイントを解説します。

gihyo.jp インフラエンジニア情報局

ネットワークやITにかかわるあらゆる業種で必要とされるインフラエンジニアに向けた技術情報や心構え,その魅力について多角的に紹介。

テストエンジニア ステーション

いま,ITに関わるあらゆる開発業務で注目されつつあるテスト系エンジニアをターゲットにしたコンテンツサイトを展開します。

一行クイックアンケート

gihyo.jpで取り上げてほしいネタは?

※検索はページ右上の検索ボックスをご利用ください。

その他の連載

読むウェブ ~本とインタラクション

ディスプレイで読む活字とそのインタラクション(interaction:相互作用)について,最新Webを紹介しながら読み解いていく。

いま,見ておきたいウェブサイト

この連載では,国内外の最新のウェブサイトを隔週更新で取り上げ,これら最新サイトの特徴や素晴らしい部分を,さまざまな角度から解説していきます。

Windows phoneアプリケーション開発入門

Windows Marcketplace for Mobileがサービス開始され,作成したアプリケーションを個人でも世界をターゲットに公開できる環境が整ってきました。これを機にWindows phoneアプリケーションの開発をしてみませんか?

ここは知っておくべき!Windows Server 2008技術TIPS

5年ぶりのサーバOSとなったWindows Server 2008が出荷されて早2年。2009年にはR2が出荷され,再び注目を集めています。発売前から実施したトレーニングによって感じた,インフラエンジニアの方々に知っておいていただきたい機能を中心にご紹介します。

キーパーソンが見るWeb業界

本連載はWeb Site Expert/gihyo.jpとの連動企画です。阿部淳也, 長谷川敦士, 森田雄のお三方による,Web業界をテーマにした座談会です。

きたみりゅうじの聞かせて珍プレー

ソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。みなさんからの投稿もお待ちしてます!

ActionScript 3.0で始めるオブジェクト指向スクリプティング

野中文雄氏が,簡単なスクリプトは書いたことがあるという初級者を対象に,ActionScript 3.0の基本からクラス定義までを解説します。

まだ間に合う「ITパスポート」受験対策 原山先生の短期合格塾

この連載では,4月18日のITパスポート試験の受験に向けて,短い期間で効率良く受験対策を行う方法や,確実に得点するための裏ワザなどを伝授していきます。

連載一覧

gihyo.jp

  • DEVELOPER STAGE
  • ADMINISTRATOR STAGE
  • WEB+DESIGN STAGE
  • LIFESTYLE STAGE
  • SCIENCE STAGE
  • NEWS & REPORT

書籍案内

  • 新刊書籍
  • 書籍ジャンル一覧
  • 書籍シリーズ一覧
  • 新刊ピックアップ
  • ロングセラー
  • 電脳会議

定期刊行物一覧

  • Software Design
  • WEB+DB PRESS
  • Web Site Expert
  • 組込みプレス