2DCGと3DCGの合成

このプログラムは、2DCGと3DCGを一枚に合成し、画面に表示するVCSSLプログラムの例です。

スポンサーリンク

---

使用方法

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

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

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

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

プログラムの起動

Windows をご使用の場合

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

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

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

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

Linux 等をご使用の場合

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

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

操作方法

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

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

題材解説

このプログラムでは、1つの画面において、2DCGと3DCGの両機能を組み合わせています。

2Dレンダラーと3Dレンダラーを組み合わせて使用

VCSSLでは、2DCGを描画する2Dレンダラー（描画エンジン）と、3DCGを描画する3Dレンダラーが用意されています。 しかし、これらはそれぞれ 2DCG / 3DCG のどちらかしか描画できません。

従って、例えば2Dの背景画像上に3Dの立体を表示させたり、3DCGの上に2Dの情報表示などを行ったりするには、 2Dレンダラーと3Dレンダラーを組み合わせて使用し、結果を合成する必要があります。

このプログラムでは、実際にそのような合成を行う、単純な例を示します。

基本構造は普通の2D描画

このプログラムの基本構造は、普通の2D描画と同様です。より具体的に言えば、 アニメーション描画を行う2DCGプログラムとほぼ同じ構造となります。

画面に表示される内容を直接描画するのも、2Dレンダラーが担います。

画像の描画と同様に、3Dレンダラーの出力内容を2DCG上に描き込む

2D/3D合成の基本的な流れとしては、2D描画の途中で、 画像を描画する場合と全く同様にして、3Dレンダラーの出力内容を2DCG上に描き込む流れになります。

つまり、3Dレンダラーの出力を直接画面に表示させるのでは無く、 「単なる一枚の画像」として扱う流れとなります。

コード解説

このプログラムのコード全体は、以下の通りです。

以下では、このコードの各部を順を追って解説します。

ヘッダ部 〜 グローバル変数の宣言

プログラムのヘッダ部では、必要なライブラリを import しています。使用しているライブラリは、 普通に2D/3D描画を扱うために必要なものばかりです。

グローバル変数でも、普通に2D/3D描画を扱うために必要となる、 レンダラー（描画エンジン）やGUIコンポーネントのID格納変数などを宣言しています。

定数パラメータ(const)を除くグローバル変数は以下の通りです。

main関数とイベントハンドラ

続いてmain関数と、ウィンドウを閉じた際のイベントハンドラです。

このフローチャートは、以下のように、典型的なアニメーション描画のフローとなっています。

main関数の最初に、画面構築などの処理を行った後に、 初期化のための initialize 関数を一度だけコールします。 initialize関数では、必要に応じて3Dモデルの配置などを記述します。

その後はアニメーション用のメインループ（無限ループ）に突入し、 毎秒数十回の頻度で paint 関数と update 関数を交互にコールし続けます。 paint関数では、必要に応じて2D描画などを記述します。

ウィンドウが閉じられるとメインループを脱出し、終了時処理のための finalize 関数を1度だけコールして、 プログラムを終了します。

画面構築やレンダラー生成などを行うinitializeComponent関数

main関数の最初では、画面のGUI構築や、レンダラー生成などの準備を行う initializeComponent 関数がコールされます。

この関数の内容全体は、普通にレンダラー生成や画面構築、設定などを行っているだけなので、ここでは割愛します。

重要なのは以下の、画面表示ラベルを生成している部分です。

上記の通り、画面の表示内容には、2Dレンダラーの出力内容（ graphics2D ）を指定しています。

つまり、2Dレンダラー（ renderer2D ）の描画内容がそのまま画面に表示されるわけです。

加えて言うなら、3Dレンダラー（ renderer3D ）の描画内容は、 そのままでは画面に影響しないという事にもなります。そのため、2Dレンダラーに、 3Dレンダラーの描画結果を描き込ませるわけです。詳しくは後の paint 関数の項目で解説します。

初期化処理を記述する initialize 関数

続いて呼ばれる initialize 関数は、最初に1度だけコールされます。 ここには最初に行わせたい処理を自由に記述します。

このプログラムでは、以下のように3Dレンダラーに座標軸モデルと球モデルを配置しています。

描画処理を記述する paint 関数

最後に、このプログラムで最も重要な部分である、paint 関数です。

paint 関数は、プログラムの開始から終了まで、毎秒数十回の頻度で繰り返し呼ばれ続けます。 ここに描画処理を記述します。

上記の通り、基本は2Dアニメーションの描画内容そのままです。まず clearGraphics2D 関数で画面をクリアし、 drawRect 関数や drawOval 関数で図形を描画しています。

重要なのは、途中で drawImage 関数により、3Dレンダラーの描画内容（ graphics3D ）を2DCG上に描き込んでいる点です。 これは、2DCG上に画像を描き込むのと全く同じです。

なお、3DCGの背景色は透明に設定してあり、 drawImage より前に記述した描画内容は3DCGの背後に、 後に記述した描画内容は手前に表示されます。

上の例では、drawRect による青い四角形は3DCGの奥に、drawOvalによる緑色の楕円は手前に表示されます。

ライセンス

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