04-07 球の移動

球を回転しながら画面上を移動させる。

例題 4-7-1

ｘ軸（横）方向に移動する画面の左右端で跳ね返す。

コード

let x = 100, y = 0, z = 0;
let dx = 10, dy = 10, dz = 10;  // 移動量

function setup() {
  createCanvas(400, 400, WEBGL);
  frameRate(10);
}

function draw() {
  background(200);
  rotateX(frameCount * 0.01);
  translate(x, y, z); 
  sphere(40);
  x += dx;
  if ( x< -160 || 160 < x)  // 跳ね返す
    dx = -dx;
}

練習問題4-7-1

球体（sphere）を、Y方向に上下に動かしなさい。
一番上または下まで動いたら、跳ね返るようにする。
translate() で位置をずらし、dy を使って上下の移動を制御する。
回転も入れて、立体的に動いているように見せよう。

練習問題4-7-2

球体を、X・Y・Zのすべての方向に動かしてみよう。
それぞれの方向で、端（−160 または +160）に到達したら、跳ね返るようにする。

translate() を使って球体の位置を3D空間で動かし、
dx, dy, dz を使って速度をコントロールする。
球体は回転させて立体的に見せる。