前回は、Vuforiaで3DのARサンプルを動かしてみました。いよいよ自分で作ったオブジェクトをARにしてみたいと思います！ということで今回は、サンプルのオブジェクトと自作のオブジェクトの置き換え手順や、その際に必要なツールなどをご紹介していきます。

こんにちはandyです。
今回は、前回ビルドまで行ったARのサンプルプロジェクトに含まれている3Dオブジェクトとマッピングデータを他のものと置き換えて別の3Dオブジェクトを表示させたいと思います。

段取りはこんな感じ。

1. プロジェクト内のモデルデータが書かれているソースを探す。
2. プロジェクト内のモデルデータ用のマッピングデータが保存されている場所を探す。
3. 3Dモデルデータを準備。
   （自分で作れる人は作ってみてください。後ほどフリーのツールもご紹介します。）
4. モデルデータをC/C++ヘッダーファイルの記述に変換。
5. プロジェクト内のファイルの置き換えとビルド。

と、こんな感じです。
私はあまりOpenGLは詳しくないので（他のこともそんなに詳しくないですが・・・）細かいことは抜きにして大雑把に進めます。

プロジェクト内のモデルデータが書かれているソースを探す

前回使ったプロジェクト「ImageTargets-2-5-4」を開いてみてください。
このプロジェクト内に「Teapot.h」というファイルが入っています。

このファイルを開くと、こんな感じになっています。

このファイルは、3Dオブジェクトの情報を記述しているもので、

• 「teapotVertices」
• 「teapotTexCoords」
• 「teapotNormals」
• 「teapotIndices」

という４項目の配列が定義されています。

「teapotVertices」はオブジェクトの拡張点座標。
「teapotTexCoords」はマッピング用の座標。
「teapotNormals」は各面の向き。
「teapotIndices」は「teapotVertices」で定義した頂点で構成される面の情報です。

また、

• 「TextureTeapotBlue.png」
• 「TextureTeapotBrass.png」
• 「TextureTeapotRed.png」

というファイルが保存されています。このファイルが表示される3Dオブジェクトにそれぞれマッピングされている画像ファイルです。

これらのファイルを置き換え、一部の表示部分のコードを修正すれば別のオブジェクトを表示できます。

3Dモデルデータを準備

まず始めに置き換え用の3Dオブジェクトとマッピングデータを用意する必要がありますので、今回は本当に簡単なデータで行います。使ったデータはリンクしておきますが、あまり面白くないので作れる方は自分でデータを作ってみてください。
サンプルファイルはこちら。以下のようなデータが入っていると思います。

ちなみに今回使うデータは、Blenderというオープンソースの3Dアプリケーションで作りました（関連記事：初心者のための！作って学ぶBlenderの基礎）。非常に良くできたアプリケーションでフリーだとは思えないくらい良くできています。

Blender http://www.blender.org

モデルデータをC/C++ヘッダーファイルの記述に変換

用意したデータをC/C++ヘッダーファイルに記述されたOpenGLデータに変換します。変換には下記のツールを使います。このプログラムは.objフォーマットの3DデータをC/C++ヘッダーファイル形式のOpenGLデータに変換するために使いますので、今回のサンプルデータ以外のモデルデータを使用する方は予め3Dデータのフォーマットを確認してください。

obj2opengl　http://heikobehrens.net/2009/08/27/obj2opengl/

obj2openglのダウンロード

このページの下の方に「OBJ2OPENGL.ZIP (script and examples)」というリンクがありますので、そこからファイルをダウンロードします。

ファイルを解凍すると下記のようなファイルがあるのがわかります。この中で「obj2opengl.pl」というファイルを使ってファイルを変換します。このファイルはPerlという言語で書かれているため、予め実行するための環境を用意しておく必要があります。

モデルデータの変換を実行する

1. 「obj2opengl.pl」というファイルを作業がしやすいようにオブジェクトファイルと同じフォルダにコピーします。

   

2. 「ターミナル」というアプリケーションを起動します。

   

3. cubeフォルダへ移動します。

   
   （パスの部分は使用されている環境によって異なります。）

4. 「obj2opengl.pl」でcube.objを変換します。

   

5. 変換が終了すると、.hという拡張子のファイルが作成されます（ここではcube.h）。

   後はこのファイルを先ほど説明したファイルと置き換えていきます。

プロジェクト内のファイルの置き換えとビルド

1. 「cube.h」ファイルを「Teapot.h」と入れ替えます。
2. 今回は「TextureTeapotBlue.png」と「cube.png」を入れ替えます。
   ここまで終わるとこんな感じ。
   
3. 次に、このファイルを読み込んでいるソースの修正を行います。修正するファイルはImageTargets>Classes>ImageTargetsフォルダ内の「EAGLView.mm」というファイルです。このファイルは実際にOpenGLでオブジェクトを表示するためのViewを記述しています。
   次の部分を修正していきましょう。

   9行目「#import “Teapot.h”」→「#import “cube.h”」
   24行目「”TextureTeapotBlue.png”,」→「”cube.png”,」

   この部分は、3Dオブジェクトを表示した際の大きさの指定です。
   29行目「const float kObjectScale = 3.0f;」→「const float kObjectScale = 50.0f;」

   60行目「obj3D.numVertices = NUM_TEAPOT_OBJECT_VERTEX;」→「obj3D.numVertices = cubeNumVerts;」
   61行目「obj3D.vertices = teapotVertices;」→「obj3D.vertices = cubeVerts;」
   62行目「obj3D.normals = teapotNormals;」→「obj3D.normals = cubeNormals;」
   63行目「obj3D.texCoords = teapotTexCoords;」→「obj3D.texCoords = cubeTexCoords;」

   「モデルデータをC/C++ヘッダーファイルの記述に変換」で作成したファイルには面の情報（Indices）が含まれていない為、下記の部分も修正します。

   65行目「obj3D.numIndices = NUM_TEAPOT_OBJECT_INDEX;」→「//obj3D.numIndices = NUM_TEAPOT_OBJECT_INDEX;」
   66行目「obj3D.indices = teapotIndices;」→「//obj3D.indices = teapotIndices;」
   156行目「glDrawElements(GL_TRIANGLES, obj3D.numIndices, GL_UNSIGNED_SHORT, (const GLvoid*)obj3D.indices);」→「glDrawArrays(GL_TRIANGLES, 0, obj3D.numVertices);」
   181行目glDrawElements(GL_TRIANGLES, obj3D.numIndices, GL_UNSIGNED_SHORT, (const GLvoid*)obj3D.indices);」→「glDrawArrays(GL_TRIANGLES, 0, obj3D.numVertices);」

4. この状態でビルドします。「chips」の画像が認識されたときに下のようなオブジェクトが表示されるようになります。

   

今回のようにコードでARアプリを作ることもできますが、3Dモデルを動かしたりする場合には複雑な動きになるとちょっと現実的ではなくなってきます。
次回から数回（何回か考えてません）で、3Dオブジェクトを動かすことを目標に、Unityというゲーム開発環境を使ってARアプリを作ってみたいと思います。

それではまた。