Project-03: Dynamic Drawing

<Rotating Garden>

sketch
    let greenVal = 0;
    function setup() {
    createCanvas(600, 600);
    background(255);
}

    function draw() {
    background(255);
    // Draw the ground
    noStroke();
    fill(170,150,146);
    rect(0, 530, 600, 70);
    // Draw flower 1
    push();
    fill(230, 190, 230, 240);
    translate(400, 400);
    rect(0,0,4,200);
    noStroke();
    for (var r1 = 0; r1 < 10; r1++) {
    if (mouseX <= 600) {
      ellipse(0, 10 + mouseX / 20, 10 + mouseX / 40, 20 + mouseX/ 20);
    }
    if (frameCount > 600) {
      ellipse(0, 40, 25, 50);
    }
    rotate(mouseX / 5);
    }
    pop();

    // Draw flower 2

    push();
    fill(235, 194, 204, 240);
    translate(300, 430);
    noStroke();
    rect(0,0,3,200);

    for (var r2 = 0; r2 < 10; r2++) {
    if (mouseY <= 600) {
      ellipse(0, 10 + mouseY / 20, 10 + mouseY / 40, 20 + mouseY / 20);
    }
    if (mouseY > 600) {
      ellipse(0, 40, 25, 50)
    }
    rotate(mouseY / 5);
    }
    pop();
  
    //Draw flower 3
    push();
    fill(245, 204, 174, 240);
    translate(180, 385);
    noStroke();
    for (var r3 = 0; r3 < 10; r3++) {
    if (mouseX <= 600) {
      ellipse(0, 10 + mouseX / 20, 10 + mouseX / 40, 20 + mouseX / 20);
    }
    if (mouseX > 600) {
      ellipse(0, 40, 25, 50)
    }
    rotate(mouseX / 5);
    }
    pop();

    //Draw flower 4
    push();
    fill(245, 174, 154, 240);
    translate(510, 425);
    noStroke();
    rect(0,0,3,300);
    rect(0,0,3,300);
    for (var r4 = 0; r4 < 10; r4++) {
    if (mouseY <= 600) {
      ellipse(0, 10 + mouseY / 20, 10 + mouseY / 40, 20 + mouseY / 20);
    }
    if (mouseY > 600) {
      ellipse(0, 40, 25, 50)
    }
    rotate(mouseY / 5);
    }
    pop();
  
    //Draw flower 5
    push();
    fill(245, 174, 184, 240);
    translate(70, 450);
    noStroke();
    rect(0,0,3,200);
    for (var r5 = 0; r5 < 10; r5++) {
    if (mouseX <= 600) {
      ellipse(0, 10 + mouseX / 20, 10 + mouseX / 40, 20 + mouseX / 20);
    }
    if (mouseX > 600) {
      ellipse(0, 40, 25, 50)
    }
    rotate(mouseX / 5);
    }
    pop();
    

    fill(120, sin(greenVal)*255, 120);
    greenVal += 0.05;
    scale(mouseX/400, mouseY/400);
    beginShape();
    vertex(285, 235);
    vertex(295, 229);
    vertex(300, 215);
    vertex(305, 229);
    vertex(315, 235);
    vertex(305, 242);
    vertex(300, 255);
    vertex(295, 242);
    endShape(CLOSE);
  }

Leave a Reply