サンプル

3Dグラフィックスの描画

ここではMascotCapsuleを用いて3Dグラフィックスを描画するための構成要素と、 3Dグラフィックスを描画するための基本的な手順について解説します。

3Dグラフィックスの描画

目次


1. 構成要素

MascotCapsuleを用いた3Dグラフィックスは以下の要素から構成されています。 各要素の詳しい解説は該当するチュートリアルを参照してください。

3D モデルデータ

ディスプレイに描画される実体です。3Dモデルデータはさらにモデルデータ、アニメーションデータ、 プリミティブ、テクスチャから構成されており、DoJaではそれぞれ、Figure、ActionTable、Primitive、 Textureクラスとして扱います。

モデルデータはモデルの形状を保持する、モデルの骨組みのようなものです。このモデルデータに アニメーションデータを設定したり、テクスチャを貼り付けることで3Dモデルを作成します。 アニメーションデータはモデルの動きを保持します。アニメーションデータを設定することで、 モデルが設定されたアニメーションを行うことができます。プリミティブは三角形や四角形などの 基本的な図形やポイントスプライトを描画します。テクスチャはモデルやプリミティブに貼り付ける 画像に関するデータを保持します。TextureオブジェクトはBMPファイルを読み込むことで取得します。

モデルデータやアニメーションデータはMBAC・MTRA、またはD4Dと呼ばれるファイルを読み込むことによって 使用します。MBACはモデルデータ、MTRAはアニメーションデータを保持しています。 D4DデータはMascotCapsule V4から扱うことのできるデータで、複数の構成要素をシーングラフとよばれる 木構造としてまとめて扱うことができます。D4DデータはMBAC・MTRA、またはH3Tと呼ばれるファイルから 作ることができ、DoJaでは読み込まれたD4DデータはGroupクラスとして扱います。

カメラ

描画された3Dオブジェクトをディスプレイに表示します。最初3Dオブジェクトはワールド座標系上に 描画されています。それをカメラ座標系に変換し、さらにスクリーン座標系に変換したのち、 各オブジェクトを表示します。また、カメラの投影法には平行投影と透視投影の2種類があります。

ライト

MascotCapsuleでは3Dオブジェクトを照らすための光源として、環境光・平行光・点光源・スポットライトの 4種類が用意されています。それぞれ位置や方向、色、輝度（明るさ）などの設定が可能です。

エフェクト

MasucotCapsuleではフォグやブレンドモードなどの視覚効果を利用することができます。 フォグは霧が立ちこめたような様子を表現できるエフェクトで、遠くにある物体をぼやかして 表示することができます。ブレンドモードは3Dモデルを半透明で表示できるエフェクトです。 その他にもモデルデータにテクスチャを貼り付けたり、パースペクティブコレクション （遠近法補正）などの設定を行うことができます。

アフィン変換による移動

MascotCapsuleでは3Dモデルやカメラを配置、移動させるのにアフィン変換と呼ばれる 4×4行列を用いた座標変換を行います。MascotCapsuleには、この変換を行うために アフィン変換用行列を保持するTransformクラスが用意されています。



2. 3Dグラフィックスの描画手順

ここではサンプルプログラムSample01Canvas.javaを用いて 3Dグラフィックスを描画する基本的な手順について解説します。

2.1.データの読み込み

まず、3Dモデルデータを作成するために、モデルデータ・アニメーションデータ・テクスチャを読み込みます。

// Sample01Canvas.java 47行
// モデルデータ
Figure figure;

// アニメーションデータ
ActionTable aTable;

// テクスチャ
Texture texture;

・・・

// Sample01Canvas.java 85行
//モデルデータの読み込み
figure = ( Figure )loadData( "figure.mbac" );

//アニメーションデータの読み込み
aTable = ( ActionTable )loadData( "figure.mtra" );

//テクスチャの読み込み
texture = ( Texture )loadData( "figure.bmp" );

・・・

// Sample01Canvas.java 165行
// loadData
Object3D loadData( String dataName ){
return Object3D.createInstance(
Connector.openInputStream( "resource:///" + dataName );

各データの読み込みには、Object3Dクラス内のcreateInstanceメソッドを使います。 読み込んだデータの型はObject3Dですので、各クラスにキャストして扱います。

2.2.モデルデータの設定

次に読み込んだFigureオブジェクトにアニメーションデータとテクスチャを設定して モデルデータを作成します。

// Sample01Canvas.java 93行

// Figureに対してアニメーションを設定
figure.setAction( aTable, 0 );

// Figureにテクスチャを貼り付ける
figure.setTexture( texture );

Figureオブジェクトにアニメーションとテクスチャを設定するにはそれぞれ Figureクラス内のsetActionおよびsetTextureメソッドを使います。 setActionメソッドの2番目の引数はアクションデータの番号です。

2.3. カメラの設定

描画したモデルをディスプレイに表示するにはカメラが必要です。 カメラは位置・参照方向・頭頂部の向きをそれぞれ３次元ベクトルで 設定することによって行います。その後Transformクラス内のlookAtメソッドを 使うことによってカメラを設定した通りに配置します。

// Sample01Canvas.java 35行
// アフィン変換行列を保持するクラス
Transform vTrans;

// カメラの位置
Vector3D position = new Vector3D( 0, 10.f, 20.f );

// 参照方向
Vector3D lookAt = new Vector3D( 0, 0, 0 );

// カメラの頭頂部の向き
Vector3D up = new Vector3D( 0, 1.f, 0 );

・・・

// Sample01Canvas.java 70行

// アフィン変換行列のインスタンスの作成
vTrans = new Transform();

// カメラの設定
vTrans.lookAt( position, lookAt, up );

2.4. ライトの設定

モデルを描画しても、ライトがなければ描画されたモデルは 真っ暗になってしまいます。ここではライトの設定例を示します。

// Sample01Canvas.java 59行
// ライトのインスタンス
Light ambLight;

・・・

// Sample01Canvas.java 79行

// ライトの種類の設定
ambLight.setMode( Light.AMBIENT );

// ライトの明るさの設定
ambLight.setIntensity( 1.0f );

ライトは種類や方向、明るさなどを設定することができます。 サンプルでは環境光を設定しています。環境光はワールド内を 一定の明るさで照らす光源ですので、明るさだけを設定します。

2.5. Graphics3D オブジェクトの設定

今まで設定してきたモデルデータやライトをGraphics3Dオブジェクトに レンダリングします。まず、GraphicsオブジェクトをGraphics3Dクラスに キャストすることによって、Graphics3Dオブジェクトを取得します。

// Graphics g;

// Sample01Canvas.java 132行
// Graphics3Dオブジェクトを取得
Graphics3D g3 = ( Graphics3D )g;

次に、投影法を設定します。

// Sample01Canvas.java 135行

// 透視投影　nearとfar、画角の設定
g3.setPerspectiveView( 1.0f, 50.0f, 45.0f );

サンプルでは透視投影に設定しています。

最後に作成したモデルデータやライトなどの3Dオブジェクトを Graphics3Dオブジェクトに追加（レンダリング）します。

// Sample01Canvas.java 56行
// フレーム時間
int frame;

・・・

// Sample01Canvas.java 62行
// 床のプリミティブ
Primitive basePrim;

・・・

// Sample01Canvas.java 128行
// Figureに現在フレーム時間を設定
figure.setTime( frame );

frame = frame < aTable.getMaxFrame( 0 ) ?
frame + aTable.getMaxFrame( 0 ) / 200 : 0;

・・・

// Sample01Canvas.java 138行
// Graphics3Dオブジェクトにライトを追加
g3.addLight( ambLight, null );

// Graphics3Dオブジェクトにプリミティブを追加
g3.renderObject3D( basePrim, vTrans )

// Graphics3DオブジェクトにFigureを追加
g3.renderObject3D( figure, vTrans );

Figureクラス内のsetTimeメソッドを設定するとFigureに対して現在時刻を 設定することができます。これによってFigureは設定された時刻をフレーム値として この時刻での外見状態に設定されます。サンプルではアニメーションの最大フレーム数を 200等分していますので、200回再描画されるとアニメーションが1周することになります。

2.6. ディスプレイに描画

オブジェクトをレンダリングするだけではディスプレイには何も描画されません。 ディスプレイにモデルを描画するには、Graphics3Dインターフェース内の flushBufferメソッドを使用します。

// Sample01Canvas.java 147行
// レンダリング結果を実描画領域に描画
g3.flushBuffer();

flushBufferメソッドを使用することで、レンダリングバッファに蓄積された結果が すべて描画されます。このメソッドの使用後はレンダリング用バッファの中身は空になります。

Sample01.java 描画結果

Sample01.java 描画結果

このページの先頭へ戻る