week07_TilingHomework

// Referans alınan desen : https://tr.pinterest.com/pin/1055599904935207/

​

​

// Toplam desen sayısı için:

let desenSayisi = 11;

​

// Çizilen dairelerin bilgilerini tutmak için:

let daireler = [];

​

function setup() {

​

  createCanvas(400, 450);

  noLoop()

}

​

function draw() {

  background(220);

​

  // Her bir desen için döngü

  for (let i = 0; i < desenSayisi; i++) {

    // Desenin başlangıç koordinatlarını belirle

    let x = 20 + i * (width / (desenSayisi + 2));

    let y = 10;

​

    // Dikey çizgi çizimi için:

    drawLine(x + width / (2 * (desenSayisi + 2)), y, x + width / (2 * (desenSayisi + 2)), height - y, 4);

​

    // Daireleri çizmek ve konumlarını kaydetmek için:

    drawAndSaveCircles(x + width / (2 * (desenSayisi + 2)), y, height - 2 * y, 10, 5, 15);

  }

}

​

// Kalın bir çizgi çizimi için:

function drawLine(x1, y1, x2, y2, kalinlik) {

  stroke(0);

  strokeWeight(kalinlik);

  line(x1, y1, x2, y2);

}

​

// Daireleri çizip ve konumlarını kaydetmek için:

function drawAndSaveCircles(x, y, uzunluk, araBosluk, minDaireSayisi, maxDaireSayisi) {

  for (let j = 0; j < int(random(minDaireSayisi, maxDaireSayisi + 1)); j++) {

    let yaricap = random(5, 15);

​

    let konum = random(y + 20, y + uzunluk - 20);

​

    // Daha önce çizilen dairelerle minimum uzaklık kontrolü yapmak için:

    //.some önündeki diziyi çalıştırır

    // ! ifadenin tersini alır (true ise false/false ise true gibi)

    if (!daireler.some(d => dist(x, konum, d.x, d.y) < 2 * d.yaricap + araBosluk)) {

      drawCircle(x, konum, yaricap);

      // Daire bilgilerini kaydetmek için:

      daireler.push({ x: x, y: konum, yaricap: yaricap });

}

}

}

​

// Dairelerin çizimi için:

function drawCircle(x, y, yaricap) {

  fill(0);

  noStroke();

  ellipse(x, y, yaricap * 2, yaricap * 2);

}

​

function mousePressed() {

  // Her fare tıkında tekrar çizdirmek için:

  daireler = [];

  redraw();

}

​

​

​

​

​

// Decompose: Only lines and circles will be used in this task. 

//The main thing is to make the radii and positions of the circles variable. 

//Just one color is enough for us. These changes provide the entire work. 

//Only the perimeter of the circles and their position on the line should change.

​

// Pattern Recognition: Circles of random numbers and sizes on 11 central lines lined up side by side. 

//The circles do not intersect each other and do not merge.

​

// Abstraction: It is a tiling pattern with circles of random size and position on a total of 11 lines. 

//The circles in the lines are always on the line and under no circumstances are they drawn on top of each other or overlapping each other.

​

//The code basically works like this:

​

// Drawing Lines and Circles: The drawLine() function draws a vertical line of the specified thickness. 

//The drawAndSaveCircles() function draws the specified number of random circles and positions them let circles = []; 

//The drawCircle() function, which allows drawing circles, also allows us to draw the circles of the tile we reference.

​

// Circle Positions and Conflicts: The drawAndSaveCircles() function checks the minimum distance with previously drawn circles before drawing each circle. 

//This command ensures that the circles are not too close to each other. 

//The positions of the circles before the circle let circles = []; 

//It provides conflict control by storing in the array.

​

//Redraw on Mouse Click: function mousePressed() on mouse click let circles = []; 

//It clears the array and redraws the page by calling the redraw() function.

​

​

​

//             _

//            /o`=

//     .=""=./::(.=""=.

//    /./.' .::::. \'. \

//   //\/ / :::::: \/\ \\

//  /\/ /\/\'::::'/\ \/\ \

//  /' `     '::'     ` `\

//           /::\

//          /\/\/\