04-05 3D描画

学習日

2025年10月21日

名前

河西恵太

練習問題4-5-1

2つの立方体を、左右に分けて配置し、
それぞれ別々の回転をするようにしなさい。

📌 たとえば、次のようにしてもよい：

• 左の立方体：ゆっくり時計回りに回転（frameCount * 0.01）
• 右の立方体：速く反対向きに回転（-frameCount * 0.02）

回転する向き（X軸まわり、Y軸まわりなど）やスピードは自由に変えてみよう。
translate()、rotateX()、rotateY() をうまく使って表現しよう。

回答

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

function draw() {
  background(200);
  normalMaterial()
  push();
  translate(-100, 0);
  rotateX(frameCount * 0.01);
  rotateY(frameCount * 0.01);
  box(100);
  pop();
  translate(100, 0);
  rotateX(frameCount * -0.01);
  rotateY(frameCount * -0.01);
  box(100);
  pop();

感想

push()を入れ忘れてしまったことにより右側の箱に3つ目を追加しようとしたところその周りを衛星みたいに回ってしまうということが発生してしまった。コピペの時に必要ではないと思って抜いてしまったのがよくなかったと思います。ミスを減らしてすらすら解けるようにしていきたいです。