Robert Oh- Project 07 – Curves

curves

//Robert Oh
//Section C
//rhoh@andrew.cmu.edu
//Project-07-Curves

//assigning variables
var nPoints = 100;
var angle1 = 0;
var adj1 = 10;
var angle2 = 0;
var adj2 = 0;
var angle3 = 0;
var adj3 = 0;

function setup() {
    createCanvas(400, 400);
    frameRate(60);
}

function draw() {
    background(0);
    
    //drawing the white circle
    ellipse(mouseX, mouseY, 170, 170);

    //drawing the red Quadrifolium 
    push();
    fill(255, 0, 0);
    translate(mouseX, mouseY + 45);
    rotate(radians(angle1));
    drawQuadrifolium();
    angle1 = (angle1 + adj1) % 360;
    pop();

    //drawing the green Quadrifolium
    push();
    fill(0, 255, 0);
    translate(mouseX + 39, mouseY - 20);
    rotate(radians(angle2));
    drawQuadrifolium();
    angle2 = (angle2 + adj2) % 360;
    pop();

    //drawing the blue Quadrifolium
    push();
    fill(0, 0, 255);
    translate(mouseX - 39, mouseY - 20);
    rotate(radians(angle3));
    drawQuadrifolium();
    angle3 = (angle3 + adj3) % 360;
    pop();

    //adjusting speed of rotation for only blue and green Quadrifoliums
    adj2 = (15 * (mouseX / width)) + (15 * (mouseY / height));
    adj3 = (15 * (width - mouseX) / width) + (15 * (width - mouseY) / height);
}

//formula taken from: http://mathworld.wolfram.com/Quadrifolium.html
function drawQuadrifolium() {
    var a = 40;
    
    beginShape();
    for (var i = 0; i < nPoints; i++) {
        var t = map(i, 0, nPoints, 0, TWO_PI);
        r = a * sin(2 * t);
        x = r * cos(t);
        y = r * sin(t);
        vertex(x, y);
    }
    endShape(CLOSE);
    
}

When I first started this assignment, I was looking around for inspiration. One morning, when I started shaving with my electric razor, I realized that my blades were in the shape similar to that of a quadrifolium. Thus, I created the three quadrifoliums in the same shape as my razor. I adjusted the speed of the top two “razors” to speed up/slow down if they are near the edges of the canvas.