mjanco – Project07 – Curves

sketch

//Michelle Janco
//Section B
//mjanco@andrew.cmu.edu
//Project-07

var gPoints = 100;
var EPITROCHOID = 0;
var curveMode = EPITROCHOID;

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

function draw() {
    background(255, 155, 100);

    // draw curve
    push();
    translate(width / 2, height / 2);
    switch (curveMode) {
    case EPITROCHOID:
        drawEpitrochoidCurve();
        break;
    }
    pop();
}

function drawEpitrochoidCurve() {
    // http://mathworld.wolfram.com/Epicycloid.html

    var x;
    var y;

    var a = 80.0;
    var b = a / 10.0;
    var h = constrain(mouseY / 20.0, 0, a);
    var ph = mouseX / 50.0;

    fill(200, 240, 200);
    beginShape();
    for (var i = 0; i < gPoints; i++) {
        var t = map(i, 10, gPoints, a, TWO_PI);

        x = (a + b) * cos(t) - h * cos(ph + t * (a + b) / b);
        y = (a + b) * sin(t) - h * sin(ph + t * (a + b) / b);
        vertex(x-10, y+10);
    }
    endShape(CLOSE);

    fill(150, 250, 0,100);
    beginShape();
    for (var i = 0; i < gPoints; i++) {
        var t = map(i, 10, gPoints, a, TWO_PI);

        x = (a + b) * cos(t) - h * cos(ph + t * (a + b) / b);
        y = (a + b) * sin(t) - h * sin(ph + t * (a + b) / b);
        vertex(x+10, y-10);
    }
    endShape(CLOSE);

}

For this project, I played around a lot with the values of my variables, as well as values in the mapping function of my for loops. Once I found a visual I liked, I knew I wanted to duplicate the pattern, offset it a bit, and change the alpha value to create some new colors where the curves overlap.