hw7

let gridSize = 8; 

let gap = 15; //space between circles

let diameter; //circle diameter

​

function setup() {

  createCanvas(400, 400); 

​

  //Stroke

  noStroke();

  // calculating circle diameter 

  diameter = (width - (gridSize + 1) * gap) / gridSize;

​

  drawGrid(); 

}

​

function drawGrid() {

  background(255, 140, 0); // orange background color 

​

  let whiteDots = []; // Beyaz dairelerin konumunu tutacak dizi

  // random 7 circle positioning

  while (whiteDots.length < 7) {

    let x = floor(random(gridSize));

    let y = floor(random(gridSize));

    let dot = createVector(x, y);

​

    // Eğer bu konum daha önce seçilmediyse beyaz daireler dizisine ekle

    if (!whiteDots.some((d) => d.x === dot.x && d.y === dot.y)) {

      whiteDots.push(dot);

    }

  }

​

  // draw grid 

  for (let a = 0; a < gridSize; a++) {

    for (let b = 0; b < gridSize; b++) {

      let x = a * (diameter + gap) + gap; // x coordinate of circle

      let y = b * (diameter + gap) + gap; // y coordinate of circle 

​

      // Eğer bu konum beyaz daireler dizisinde ise, daireyi beyaz yap, aksi halde siyah yap

      if (whiteDots.some((d) => d.x === a && d.y === b)) {

        fill(0,245,255); // blue random circles 

      } else {

        fill(255,255,255); // white circles

      }

      ellipse(x + diameter / 2, y + diameter / 2, diameter, diameter); // draw circle 

    }

  }

}

​

function keyPressed() {

  if (key === 'm' ) { 

    drawGrid(); 

  }

}

​

​

//Variables 

//gridSize: Defines the size of the grid.

//gap: Represents the space between circles.

//diameter: Holds the circle diameter.

//whiteDots: Keeps track of positions for white circles

​

​

//Functions

//setup(): Initializes the canvas, sets up stroke, calculates circle diameter, and draws the grid initially.

//drawGrid(): Handles the main logic for drawing the grid, the random positioning of white and blue circles, and draws them.

//keyPressed(): Triggers the regeneration of the grid when the 'm' key is pressed.

//Uses nested loops (for loops) to generate the grid of circles based on the defined gridSize and gap.

//Circle Positioning:Utilizes randomization to position seven white circles within the grid.

// Detects the 'm' key press to regenerate the grid.

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​