雑記

03-05 繰り返し (for文3)

Posted on by 77curry / 0件のコメント

2025年10月15日

名前

茅野壮甫

自分で作った図形（コードと画像）

✅ 練習問題 3-5-1

function setup() {
  createCanvas(300, 300);
  background(216, 230, 243);
  stroke(177, 208, 231);
  strokeWeight(2);
  noFill();
  for (let d = 10; d < 300; d += 10) {
    circle(150, 150, d);
  }
}

📷 実行結果

✅ 練習問題 3-5-2

function setup() {
  createCanvas(300, 300);
  background(216, 230, 243);
  stroke(177, 208, 231);
  strokeWeight(2);
  noFill();
 for (let d = 20; d < 160; d += 20) {
    rect(0+d, 0+d, 300-d*2, 300-d*2);
  }
}

📷 実行結果

✅ 練習問題 3-5-3

function setup() {
  createCanvas(300, 300);
  background(255);
  fill(235, 210, 120);
  noStroke();
  for (let y =0;y<=200; y+=100){
    for (let x =0;x<=200; x+=100){  
      triangle(x, y, x,100+y, 100+x, y);
    }
   }
}

📷 実行結果

✅ 練習問題 3-5-4

function setup() {
  createCanvas(320, 320);
  background(223, 103, 86);
  fill(239, 209, 119);
  noStroke();
  for (let x = 1; x <= 4; x++) {
     for (let d = 80; d <= 320; d += 80){ 
      ellipse(-40+x * 80,-40+d,80,80);
  }
 }
}

📷 実行結果

✅ 練習問題 3-5-5

function setup() {
  createCanvas(260, 60);
  background(223, 103, 86);
  fill(239, 209, 119);
  noStroke();

  for (let i = 0; i < 6; i++) {
    if (i % 2 == 0)
      rect(10 + i * 40, 10, 40, 40);
    else
      circle(30 + i * 40, 30, 40);
  }
}

📷 実行結果

✅ 練習問題 3-5-6

function setup() {
  createCanvas(260, 180);
  background(236, 230, 226);
  stroke(68, 55, 78);

  for (let i = 0; i < 6; i++) {
    for (let j = 0; j < 4; j++) {
      if ((i + j) % 2 == 0)
        fill(147, 135, 155);
      else
        noFill();
      rect(10 + i * 40, 10 + j * 40, 40, 40);
    }
  }
}

📷 実行結果

✅ 練習問題 3-5-7

function setup() {
  createCanvas(260, 180);
  background(236, 230, 226);
  stroke(68, 55, 78);

  for (let i = 0; i < 6; i++) {
    for (let j = 0; j < 4; j++) {
      if ((i + j) % 2 == 1)
        fill(147, 135, 155);
      else
        noFill();
      rect(10 + i * 40, 10 + j * 40, 40, 40);
    }
  }
}

📷 実行結果

✅ 練習問題 3-5-8

function setup() {
  createCanvas(260, 180);
  background(223, 103, 86);
  fill(239, 209, 119);
  noStroke();
for(let j =0; j<4; j++){
  for (let i = 0; i < 6; i++) {
    if ((i+j) % 2 == 0)
      rect(10 + i * 40, 10+j*40, 40, 40);
    else
      circle(30 + i * 40, 30+j*40, 40);
  }
 } 
}

📷 実行結果

✅ 練習問題 3-5-9

function setup() {
  createCanvas(320, 200);
  background(223, 103, 86);
  fill(239, 209, 119);
  noStroke(); 
  
for (let b =0; b <=160; b += 40){
  for (let d = 0; d <= 400; d += 80){
    triangle(-160+d+b,b,-160+d+b,40+b,-120+d+b,40+b)
    triangle(-120+d+b,b,-80+d+b,b,-80+d+b,40+b)
  }
 }
}

📷 実行結果

まとめ・感想

for文を2回使ったり条件分岐を使ったりすることで、様々な模様をプログラムで書くことができる。

コメントする