学習日
2026年4月11日
名前
リゼンデス新菜
自分で作った図形（コードと画像）
✅ 練習問題 1-4-1
前回作成した練習問題1-3-3 のキャンバス色を、初期値のグレーからパステルベージュ（243, 235, 216）に変更してみましょう。
function setup() {
createCanvas(400, 400); // キャンバスのサイズを 400x400 に設定
background(243, 235, 216); // 背景色をグレー (0:黒 〜 255:白)
circle(130, 200, 170); // 座標(200, 200)に直径200の円を描く
circle(270, 200, 170);
}📷 実行結果
✅ 練習問題 1-4-2
練習問題1-4-1 のスクリプトで描いた図形を次の通りに変更しなさい。
- 塗りつぶしの色：(231, 215, 177)
- 枠線の色：キャンバスと同じ色
- 枠線の太さ：6px
function setup() {
createCanvas(400, 400); // キャンバスのサイズを 400x400 に設定
background(243, 235, 216); // 背景色をグレー (0:黒 〜 255:白)
fill(231, 215, 177)
stroke(243, 235, 216)
strokeWeight(6)
circle(130, 200, 170); // 座標(200, 200)に直径200の円を描く
fill(231, 215, 177)
stroke(243, 235, 216)
strokeWeight(6)
circle(270, 200, 170);
}📷 実行結果
✅ 練習問題 1-4-3
先の練習問題の色を自分好みの色に変更しなさい。完成したら、キャンバスを右クリックして「画像を名前をつけて保存」し、PG部のSlackで先生に送信しなさい。
function setup() {
createCanvas(400, 400); // キャンバスのサイズを 400x400 に設定
background(169, 210, 255); // 背景色をグレー (0:黒 〜 255:白)
fill(194, 218, 255)
stroke(169, 210, 255)
strokeWeight(6)
circle(130, 200, 170); // 座標(200, 200)に直径200の円を描く
fill(194, 218, 255)
stroke(169, 210, 255)
strokeWeight(6)
circle(270, 200, 170);
}練習問題1-4-4
📷 実行結果
まとめ・感想
丸や背景の色の変え方
丸の色ーfill(~,~,~) で変える
丸の枠線の色ーstroke(~,~,~)