project 4: string art

I made my piece about flowers. I used functions to be able to place flowers wherever I want on the canvas, although there are only two right now

flower string art
// isis berymon section D
var dx;
var dy;
var numLines;


function setup() {
    createCanvas(400, 300);
    background(84, 111, 82); //green
}

function draw() {
    //center flower
    stroke(134, 190, 243); //light blue
    petal(150, 100, 250, 100, 200, 150);
    petal(250, 100, 250, 200, 200, 150);
    petal(250, 200, 150, 200, 200, 150);
    petal(150, 100, 150, 200, 200, 150);
    stroke(144, 115, 245); //light purple
    petal(125, 75, 175, 75, 200, 150);
    petal(125, 75, 125, 125, 200, 150);
    petal(225, 75, 275, 75, 200, 150);
    petal(275, 75, 275, 125, 200, 150);
    petal(275, 175, 275, 225, 200, 150);
    petal(275, 225, 225, 225, 200, 150);
    petal(175, 225, 125, 225, 200, 150);
    petal(125, 225, 125, 175, 200, 150);
    flowerCenter(200, 150);
    //right flower
    stroke(134, 190, 243); //light blue
    petal(350, 0, 400, 50, 400, 0);
    stroke(144, 115, 245); //light purple
    petal(300, -25, 350, 25, 400, 0);
    petal(375, 50, 425, 75, 400, 0);
    flowerCenter(400, 0);
    noLoop();
}

function flowerCenter(x, y) {
    stroke(245, 231, 115); //light yellow
    numLines = 50;
    for(var i = 0; i <= numLines; i++){
        push();
        translate(x, y);
        rotate(radians(i*360/numLines)) // draws lines in a circle
        line(0, 0, 0, 25);
        pop();
    }
}

function petal(x1, y1, x2, y2, centerX, centerY) {
    numLines = 10;
    dx = (x2-x1)/numLines;
    dy = (y2-y1)/numLines;
    var drawX1 = x1;
    var drawY1 = y1;
    for(var i = 0; i <= numLines; i++){
        line(drawX1, drawY1, centerX, centerY); //lines all come from center
        drawX1 += dx;
        drawY1 += dy;
    }
}

Leave a Reply