学習日
2025年6月3日
名前
樋口桜大
自分で作った図形（コードと画像）
✅ 練習問題 1-4-1
長方形を別の角度で敷き詰めよう！
例…最初の角度を-45度、長方形の内部角度を45度と設定してみる。
function setup() {
createCanvas(640, 480);
background(220);
const RADIAN = Math.PI / 180;
let leng = 400.0; // 対角線の初期値
setpoint(50, 100); setangle(-45);
for (let i = 1; i <= 10; i++) {
move(leng); // 対角線を引く
let x = leng * Math.cos(45 * RADIAN);
let y = leng * Math.sin(45 * RADIAN);
turn(180 - 45); move(y);
turn(90); move(x);
turn(90); move(y);
turn(90); move(x);
turn(45);
leng = leng / Math.sqrt(2.0);
}
}📷 実行結果
✅ 練習問題 1-4-2
斜線と長方形の比率を変えて模様を作ろう！
例…長方形の対角線の長さや比率を変えて、1/2や1/3など異なる比率で敷き詰めてみる。
function setup() {
createCanvas(640, 480);
background(220);
const RADIAN = Math.PI / 180;
let leng = 400.0; // 対角線の初期値
setpoint(50, 100); setangle(-54.7);
for (let i = 1; i <= 10; i++) {
move(leng); // 対角線を引く
let x = leng * Math.cos(54.7 * RADIAN);
let y = leng * Math.sin(54.7 * RADIAN);
turn(180 - 35.3); move(y);
turn(90); move(x);
turn(90); move(y);
turn(90); move(x);
turn(35.3);
leng = leng / Math.sqrt(4.0);
}
}📷 実行結果
✅ 練習問題 1-4-3
カラーリングを追加しよう！
各長方形に異なる色をつけて、色彩豊かな模様を作成してみましょう。奇数番目の長方形と偶数番目の長方形で異なる色を設定してください。（奇数…赤・偶数…青など）
function setup() {
createCanvas(640, 480);
background(220);
const RADIAN = Math.PI / 180;
let leng = 400.0; // 対角線の初期値
setpoint(50, 100); setangle(-54.7);
for (let i = 1; i <= 10; i++) {
if(i % 2 == 1)
stroke(255, 0, 0);
else
stroke(0, 0, 255);
move(leng); // 対角線を引く
let x = leng * Math.cos(54.7 * RADIAN);
let y = leng * Math.sin(54.7 * RADIAN);
turn(180 - 35.3); move(y);
turn(90); move(x);
turn(90); move(y);
turn(90); move(x);
turn(35.3);
leng = leng / Math.sqrt(2.0);
}
}📷 実行結果
まとめ・感想
・長方形の角度を変えるときに、一箇所変えるだけでなく、他の「角度」についてのコマンドの部分も変えることを忘れてはいけないと思った。
・比率を変えるときには、分数で表すのではなく、最初に用意されていたコマンドの数から分数を利用して、比率を書く必要があり、大変だった。
・長方形が、奇数番目と偶数番目で色を変えるとき、今まで使ってきた「if文」などの条件判定を使う必要があったため、一つ一つの単元の復習はとても大切だと感じた。