yoppa.org


人工言語入門 A 2010

Processingによる3Dプログラミング

今日の内容

Processingで3DCGプログラミング

  • 3Dの座標系
  • OpenGLとは
  • 2Dのアニメーションを3Dに拡張してみる
  • 3D座標で図形を描く
  • 視点の移動
  • 3Dのを用いた高度なアニメーション

コンピュータで3Dを表現するには

コンピュータ画面で3Dを表現したい

  • コンピュータのディスプレイは、2D (縦横に並んだピクセル)
  • 奥行は擬似的に表現するしかない
  • 画面に、立体や空間などの3次元の存在を投影して描画する = 3DCG (3次元グラフィックス)

2次元平面に3次元の存在を投影するには、様々な数学的な知識が必要

  • Processingではこうした演算を自動的に行うことが可能
  • 3次元の座標系をそのまま使用できる
  • 高速な表示のためのライブラリ(OpenGL)も標準で使用可


コンピュータ画面での3Dを表示する

3D空間の座標系

X (幅)、 Y (高さ) に加えて、奥行を表現する座標軸 Z が加わる。


3Dの座標系

3Dプログラミング基本

まず2Dの図形を回転するプログラムを作成してみる

  • translateで画面の中心を座標の原点に
  • 以下の処理を繰り返す
    • 背景描画
    • rotateで回転
    • rectを描画
    • 回転する角度を更新

現状の回転する四角形のプログラム

  • 2D的な視点では平面上で回転している、これを3D的な視点に変更してみる
  • 現状では、Z軸を中心軸としてXY平面上に置いてある物体が回転している
  • では軸をZ軸ではなく、他の軸(X軸、Y軸)にすると果してどうなるのか

回転する軸を指定してrotateする関数

3D座標を用いたプログラミングをする際の注意点

レンダラー (描画の際の方式) を指定する必要がある

  1. P3D – Processing専用の3D描画エンジン
  2. OpenGL – 3Dグラフィックスのためのプログラムインターフェイス、高速に3D画像を描画できる

P3Dを使用する場合

  • size関数に以下の指定をする

OpenGLを使用する場合

  • プログラムの先頭でOpenGLのライブラリを読み込み
  • size関数にOPENGLの指定をする

OpenGLを使用した3次元空間での回転

x軸を中心に回転

x,y,z軸をそれぞれ回転

3D図形の描画デモ

四角形を3D空間にタイル状に敷き詰める

  • for文を2重に入れ子にして、X,Y方向にグリッド状に四角形を敷きつめていく
  • ただし個々の四角形はすこしだけ斜めに傾けて立体感を強調する
  • マウスの位置によって、座標全体を回転してみる
  • まずは単純に描画してみる

ライティング

Processinには様々なライティングの方法を用いることができる

  • ambientLight() – 環境光
  • directionalLight() – 一定方向から差し込む平行光
  • pointLight() – 点光源
  • spotLight() – スポットライト

様々な光を活用しながら、複雑なライティングをしてみる

カメラ

Processingでは何も指定していない時にはカメラ(視点)の場所は、中心点(0, 0, 0)。しかし、camera() 関数を使用することで、視点をコントロールすることができる

camera() 関数

  • camera(eyeX, eyeY, eyeZ, centerX, centerY, centerZ, upX, upY, upZ)
    • eyeX, eyeY, eyeZ – 視点の位置
    • centerX, centerY, centerZ – 注視する中心位置
    • upX, upY, upZ – カメラの向き

マウスの位置でカメラの位置をコントロールしてみる

3D空間でのアニメーション

少しずつスピードを変化させながら回転する立方体を作成してみる

サンプルファイルのダウンロード

今日とりあげた全てのサンプルは下記からダウンロードしてください。

  • Tomohiro Suzuki

    ダウンロードしたサンプルプログラムのうち、”_06_3dtile_camera.pde”について、
    上記Webコンテンツ記載の内容と異なっており、”void setup”が2つ存在しエラーとなります。