配列を3Dグラフにアニメーションプロットする（曲面/メッシュグラフ）

このVCSSLプログラムは、座標値が格納された配列の内容を3Dグラフにプロットし、 それを連続的にくりかえす事で、アニメーションさせるプログラムです。 サンプル的な短いコードなので、改造や流用のベースに適しています。

» 関連ページ： Java言語での3Dグラフ描画についてはこちら

スポンサーリンク

---

使用方法

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

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

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

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

プログラムの起動

Windows をご使用の場合

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

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

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

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

Linux 等をご使用の場合

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

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

起動後

起動すると、3Dグラフが起動し、適当に計算した座標値のグラフがアニメーション表示されます。

プロットする内容を変えるには、コード中の座標値値配列を代入している部分（ 2重になっている for 文の内側の中身 ）を適当に書き換えてください。

コード解説

それでは、このプログラムのコード内容について解説していきます。 このプログラムのコードはVCSSLで記述されています。

コード全体

まずは、コード全体を見てみましょう。

流れとしては、前半部で座標値配列の確保やグラフの起動・設定を済ませた上で、 後半部（28行目〜）でアニメーションの処理を行っています。

先頭部分

先頭部分を見てみましょう。

先頭の「 coding Shift_JIS; 」では、プログラムの文字コードを明示しています（ UTF-8も可 ）。必須ではありませんが、書いておくと文字化けするのを防げます。

「 import tool.Graph3D; 」の部分は、 3次元グラフを扱うための「 tool.Graph3D 」ライブラリを読み込んでいます。 その後の「 import Math; 」の部分は、 数学関数を扱うための「 Math 」ライブラリを読み込んでいます。

座標値配列の用意

続いて、グラフにプロットする内容を格納する、座標値配列を用意する部分です。

ここで xData が格子点のX座標値を格納する配列であり、同様に yData がY座標値、zData がZ座標値を格納する配列です。 これらは2次元配列で、その2つのインデックスが、メッシュ内の格子点の位置に対応します。 例えば、格子点が下図のように並んでいたとしましょう：

この場合、格子点のX/Y/Z座標値を格納する2次元配列 xData / yData / zData におけるインデックスの意味は：

となります。上で示したコードでは、格子Y番号は変数 yi、格子X番号は変数 xi となっています。

ところで、インデックスの順序は

としてもよく、どちらでも構いません。 実は、メッシュの辺がX軸とY軸の方向に一致している必要もなく、平行四辺形のようにひしゃげていたり、 球面上の経線と緯線でもかまいません。 要するに、なんらかの面の上をメッシュ状に区切った際の、格子点の「縦」と「横」の位置に対応する番号であればなんでもOKです。

グラフを起動し、プロット範囲などの設定を行う

続いて、3Dグラフを起動して、プロット範囲などの初期設定を行う部分です。

「 配列を3Dグラフにプロットする（点/線グラフ） 」 の回では、プロット範囲の設定などは行わず、標準の状態のままで用いていました。 その場合、プロットするデータに合わせて、範囲が自動で調整されます。

しかし今回のようにアニメーションさせる場合は、 アニメーションのコマ毎に範囲が変わってしまうと逆に厄介なので、 明示的に範囲を指定した上で、自動調整機能を無効化しています：

このように newGraph3D関数で3次元グラフソフトを起動した上で、 設定を行っています。

なお、このnewGraph3D関数は、呼ぶ度にグラフソフトを1個起動し、そのグラフソフトに固有のID番号を割り振って返します。 例えば3次元グラフソフトを何個も起動した場合、12番グラフ、22番グラフ、101番グラフ、 …といったように、それぞれに番号が割り振られているわけです。 上では、生成したグラフに割り振られたID番号をint型変数「 graph 」に格納しているわけです。

グラフに対して設定やプロットなどの操作を行う際は、このように控えたID番号を用いて、どのグラフに対する操作なのかを指定します。 実際に、すぐ後でX範囲設定の関数 setGraph3DRangeX の引数に、変数 graph に控えたID番号を渡していますね。

また、今回のコードでは曲面＆メッシュグラフを描かせるため、 setGraph3DOption 関数を用いて、 曲面プロット（ WITH_MEMBRANES ）とメッシュプロット（ WITH_MESHES ）のオプションを有効にした上で、 デフォルトの点プロット（ WITH_POINTS ）オプションは無効化しています。 これらはグラフ画面上部のメニューバーにある「オプション」メニューから、手動で変更する事もできます。

座標値配列の更新とグラフプロットをくりかえし、アニメーションさせる

さて、残りは肝心のアニメーション部分です。 アニメーションは、パラパラ漫画の要領で、少しずつ違ったグラフを連続でプロットさせ続ける事で行います。

2重の for 文になっていますが、外側の for 文が、時間に関するループ ＝ アニメーションループです。 パラパラ漫画でいうところの、ページをめくるループですね。 アニメーションの用語では、ページというよりも「 フレーム 」と呼んだりします。

さて、外側の for 文の中身が、アニメーションの1フレーム（1ページ）ごとの処理です。 全体的な流れとしては、まずそのフレームに対応する時刻 t の値を求めて、 その t の値に基づいて座標値配列の内容を更新し、 その内容をグラフに描かせて、最後に少しだけ小休止、という内容になっています。 これを毎秒数十回くりかえす事で、人間の目には動いて見えるわけですね。

これらの処理の中で、グラフに描く内容を決めているのは、 座標値配列を更新する部分です。 抜き出すと以下の通りです：

X座標とY座標についてはメッシュを張る格子点の座標となるため、 グラフのX/Y範囲をそれぞれ pointN-1 等分 ※ した点としています。

※ メッシュの1方向あたりの座標点の数が pointN 個なので、その間の区間の数は pointN-1 個になります （指と指の間は4つですよね？）。 なので、点がX方向に等間隔に並ぶとすると、その間隔 dx は「 X範囲の長さ / (pointN-1) 」、 つまり「 (xMax-xMin) / (pointN-1) 」になります。

Z座標については cos(x + t) * sin(y + t) としていますが、 これは「いかにも3Dグラフっぽい形」になるように適当に決めただけなので、 このあたりは描かせたい内容に応じて書き換えてください。

Z座標の式を適当に書き換えるだけでも意外な形や動きが見られるので、 色々と遊んでみると楽しめるかもしれません。

連番の画像ファイルに出力したい場合は…

アニメーション内容を、連番の画像ファイルに出力したい場合があるかもしれません。 そのような場合には、アニメーションループ内の末尾でexportGraph3D関数を使用し、画像を出力します。 ただし、画像が無限に生成されるのは色々とまずいので、一般には画像を出力する時間の範囲を限定しておくようにしましょう。

例えば上のコードでは、アニメーションループ部分の末尾に、以下のような内容を追記します：

このようにすると、プログラムを実行した際、同じフォルダ内にPNG形式の画像ファイル 「 image_0.png 」 ... 「 image_100.png 」 が生成されます。 このような連番画像ファイルは、画像編集ソフトや動画編集ソフトなどを用いて、動画形式のファイルに変換できます （方法は「 連番 画像 動画 」 などでWeb検索してみてください）。

なお、このコードアーカイブでは、連番画像ファイルをそのままアニメーション再生するツールも公開しています：

• 連番画像をアニメーション再生する簡易ツール

ライセンス

この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 氏の米国およびその他の国における商標または登録商標です。
• その他、文中に使用されている商標は、その商標を保持する各社の各国における商標または登録商標です。