今回はテキスト3-3(079ページ~)のシェーディングについての実践を行う。環境光、拡散反射、鏡面反射、(テキストにはないが) 点光源を当てたときの見え方を調べる。
オンラインで受講でPCにProcessingが入っていない場合は、まず
Processing をダウンロードしてインストールしてから以下の課題を行う。
- このリンクのうち自分の環境にあったものをダウンロードし、zipファイルを展開する
- 展開してできたフォルダの中の「processing.exe」を実行する
- 「WindowsによってPCが保護されました」というメッセージが出た場合は「詳細設定」を選び「実行」を押す
球形のオブジェクトに環境光だけを当てたときの見え方を確認する。
- Processingを起動する。
- 以下のコードをProcessingのエディタにコピー&ペーストし、「ex13_1」という名前で保存する。
PVector rot = new PVector(0, 0, 0);
void setup() {
size(500, 500, P3D);
noStroke();
drawSphere();
save("data/画像1.png");
}
void draw() {
drawSphere();
}
void drawSphere(){
background(0);
ambientLight(50, 50, 50); // 環境光
translate(width/2, height/2); // 原点を画面中心に移動
rotateX(rot.x); // 縦回転
rotateY(rot.y); // 横回転
sphereDetail(64, 64); // 球の経度方向、緯度方向の分割数
sphere(150); // 半径150の球
}
// ドラッグによる回転
void mouseDragged(){
rot.x -=(mouseY-pmouseY)*0.01;
rot.y +=(mouseX-pmouseX)*0.01;
} |
- プログラムを実行する。
(図のように灰色の球が表示される)
- プログラムを終了させ、上のメニューから「スケッチ」→「スケッチフォルダーを開く」を選び、出てきたウインドウで「data」をダブルクリックする。
すると、実行結果と同じ画像「画像1.png」ができていることがわかる。
ダブルクリックして開いてみると大きい画像で確認できる。

\(n\) の値を連続的に変化させ、\(n\) の大きさとハイライトの大きさの関係を確認する。
- Processingのメニューから「ファイル」→「名前をつけて保存」を選び、「ex13_4」という名前で保存する。
- コードを以下のように書き換えて実行する。
- 8行目 : 「画像3」→「画像4」に書き換え
- 17行目 : 「float n=2.0;」→「float n=4.0+2.0*cos(frameCount/50.0);」に書き換え
\(n\) が2~6の範囲で変化し、それに応じてハイライトの大きさが変わる。ドラッグで回転させることもできる。
(検定試験の第23問のcの解答のように、\(n\) が大きくなるとハイライトは小さく、\(n\) が小さくなるとハイライトは大きくなる)

dataフォルダには、このプログラムを起動した瞬間の (\(n\) が6で、回転させる前の) 実行画面の状態と同じ画像ができている。

点光源の位置を連続的に変え、見え方の変化を確認する。
- Processingのメニューから「ファイル」→「名前をつけて保存」を選び、「ex13_6」という名前で保存する。
- コードを以下のように書き換えて実行する。
- 8行目 : 「画像5」→「画像6」に書き換え
- 17行目 : 「float r=180;」→「float r=200+20*cos(frameCount/50.0);」に書き換え
\(r\) が180~220の範囲で変化し、球の照らされ方が変わる。ドラッグで回転させることもできる。

dataフォルダには、このプログラムを起動した瞬間の (\(r\) が220で、回転させる前の) 実行画面の状態と同じ画像ができている。
