頂点配列によるモデルの変形アニメーション

このプログラムは、頂点配列によってモデルをアニメーション変形させる、サンプルのVCSSLプログラムです。

このプログラムは以下のプログラムの応用編です。

• 頂点配列によるモデルの作成（四角形格子メッシュ形式）

スポンサーリンク

---

使用方法

ダウンロードと展開（解凍）

まず、PC（スマホは未対応）で上の画面の「 ダウンロード 」ボタンを押してください。 するとZIP形式で圧縮されたファイルがダウンロードされます。

その後、ZIPファイルを右クリックして「すべて展開」や「ここに展開」などで展開（解凍）してください。 展開が成功すると、ZIPファイルと同じ名前のフォルダができ、その中にZIPファイルの中身が入っています。

» 展開がエラーで止まってしまう場合や、ファイル名が文字化けしてしまう場合は…

プログラムの起動

Windows をご使用の場合

上記でZIPファイルを展開したフォルダ内にある、以下のバッチファイルをダブルクリック実行してください：

もしプログラムを書き変えながら使いたい場合は、代わりに「 VCSSL_Editor__プログラム編集はこちら.bat 」を実行してください。

正常に起動できると、初回のみ、Java実行環境を入手するか等を尋ねられるので、適時答えて済ませると、プログラムが起動します。 2回目以降はすぐに起動します。

» うまく起動できずにエラーになってしまう場合は…

Linux 等をご使用の場合

ZIPファイルを展開したフォルダ内へコマンドライン端末で cd して、以下の通り入力して実行してください：

» javaコマンドが使用できない等のエラーが表示される場合は…

操作方法

画面上で、下記のマウス操作を行えます。

• 左ドラッグ … 視点の回転
• 右ドラッグ … 視点の平行移動
• ホイールスクロール … 拡大/縮小

題材解説

モデルの作成後に形状を変更する

このプログラムは以下のプログラムの応用になっています。以下のプログラムで解説した部分については、今回は省略気味になっていますので、必要に応じて合わせてご参照下さい。

• 頂点配列によるモデルの作成（四角形格子メッシュ形式）

上のプログラムでは、頂点配列からモデルを作成して配置しました。固定的な形のモデルならそれで十分です。しかしその後に、モデルの形状を変更したい場合は多いと思います。

このような場合、モデルに頂点配列を再設定する事で、形状を更新する事ができます。例えばアニメーションなら、画面更新タイミングごとに頂点配列を少しずつ変化させ、モデルに再設定する事で、連続的に変形させる事が可能です。

頂点配列の形式について

モデルに再設定する頂点配列は、そのモデルの作成時に用いた頂点配列と、同じ形式である必要があります。

例えば今回は、四角形格子メッシュ（QUADRANGLE_GRID）形式の頂点配列で作成したモデルを扱うので、変形にも同形式の頂点配列を使用します。

なお、四角形格子メッシュ形式とは、格子状に並ぶ四角形を扱うための、縦方向と横方向のインデックスをもつ座標値配列です。詳細は先述のプログラムをご参照下さい。

簡単に述べると、この形式での座標値配列は、上図の通り

[ 格子点Y番号 ][ 格子点X番号 ][ その格子点のXYZ(0〜2)]

という3次元インデックスで作成します。左の2次元が格子内での格子点番号（上図参照）を、右の1次元がその格子点の空間座標のX/Y/Zを選択します。値に格子点の座標値を格納します。

コード解説

コード全体

このプログラムのコード全体は、以下のようになっています。

以下では、コードの各部について解説します。

先頭領域

プログラムの先頭領域では、数学関数を扱う標準ライブラリ「 Math 」と、 3次元グラフィックスを扱う標準ライブラリ「 Graphics3D 」、 それに加えて3DCG用フレームワーク「 graphics3d.Graphics3DFramework 」を読み込んでいます。

グローバル変数の宣言

続いてグローバル変数の宣言です。

最初に、グリッドのX/Y方向の分割数（その方向への格子点の個数）を宣言しています。それに続いて、四角形格子メッシュ形式に合った頂点配列を宣言しています。

また、モデルIDを格納する変数や、アニメーション変形に使う時刻変数なども宣言しています。

onStart関数の実装

続いて、onStart関数を実装しています。この関数は、フレームワークから自動で、プログラムの開始時に一度だけ呼ばれます。ここで画面設定や、立体モデルの生成や配置などの初期化処理を実装します。

ここでは、頂点配列から四角形格子モデル形式（QUADRANGLE_GRID）を指定してモデルを作成しています。 また、それに青い色を設定して、レンダラー（描画エンジン）に配置登録しています。

このあたりに関する詳しい解説は、先にも述べましたが、下記プログラムに掲載していますので、必要に応じてご参照下さい。

• 頂点配列によるモデルの作成（四角形格子メッシュ形式）

onUpdate関数の実装

最後に、このプログラムの中心である、onUpdate関数の実装です。この関数もまた、フレームワークから自動で呼ばれます。しかも一度だけではなく、画面更新タイミング（通常は毎秒30回）ごとにずっと呼ばれ続けます。

ここで、少しずつ異なる頂点配列をモデルに設定する事で、モデルを少しずつ変形させ、アニメーション効果で動いているように見せかけます。パラパラ漫画の要領ですね。

なお、頂点配列の再設定には Graphics3D ライブラリの setModelVertex 関数を用います。具体的な処理は以下のように記述しています。

最初に、時刻変数 time を少しだけ（ timeStep の分だけ ）加算しています。

続いて、頂点配列の中身に、その時刻における座標値をセットしています。今回は sin 関数で波を表現しています。時間に応じて動かすために、先ほどの時刻変数を sin 関数のパラメータ部に含めています。

最後の行で、setModelVertex 関数によって、頂点配列をモデルに再設定しています。この時点でモデルの形状が変更されます。

ライセンス

このVCSSL/Vnanoコード（ 拡張子が「.vcssl」や「.vnano」のファイル ）は実質的な著作権フリー（パブリックドメイン) である CC0 の状態で公開しています※。 記事中にC言語/C++/Java言語などでのサンプルコードが掲載されいてる場合は、それらについても同様です。 そのままでのご利用はもちろん、改造や流用などもご自由に行ってください。

※ ただし、このコードの配布フォルダ内には、ダウンロード後すぐに実行できるように、 VCSSLの実行環境も同梱されており、そのライセンス文書は「 License 」フォルダ内に同梱されています （要約すると、商用・非商用問わず自由に使用できますが、使用の結果に対して開発元は一切の責任を負いません、といった具合の内容です）。 配布フォルダ内の各構成物の一覧やライセンスについては「 ReadMe_使用方法_必ずお読みください.txt 」をご参照ください。

※ Vnano の実行環境については、別途スクリプトエンジンのソースコードも一般公開しており、 何らかのソフトウェア内に組み込んでご利用いただく事も可能です。詳細はこちらをご参照ください。

この記事中の商標などについて

• OracleとJavaは、Oracle Corporation 及びその子会社、関連会社の米国及びその他の国における登録商標です。文中の社名、商品名等は各社の商標または登録商標である場合があります。
• Windows は、米国 Microsoft Corporation の米国およびその他の国における登録商標です。この記事は独立著作物であり、Microsoft Corporation と関連のある、もしくはスポンサーを受けるものではありません。
• Linux は、Linus Torvalds 氏の米国およびその他の国における商標または登録商標です。
• その他、文中に使用されている商標は、その商標を保持する各社の各国における商標または登録商標です。