Project 07: Composition with Curves

var points = 100;

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

function draw() {    
    background(map(mouseX, 0, width, 50, 0)); // background color goes from grey -> black as mouse moves to the right
    translate(width/2, height/2); // move origin to center
    hypotrochoid(); // draw the curve   
}

function hypotrochoid() {
    // https://mathworld.wolfram.com/Hypotrochoid.html
    var x; 
    var y;
    var a = map(mouseX, 0, width, 50, 80); // radius of fixed circle
    var b = map(mouseY, 0, height, 0.1, 1); // radius of circle rolling around fixed circle
    var h = mouseX/2; // distance from center of interior circle
    strokeWeight(map(mouseX, 0, width, 0.1, 3)); // stroke weight increases as mouse moves to the right
    stroke(mouseX, 100, mouseY);
    noFill();
    beginShape();
    for (var i = 0; i <= points; i ++) {
        var t = map(i, 0, points, 0, TWO_PI);
        x = (a - b) * cos(t) + (h * cos(((a - b)/b) * t));
        y = (a - b) * sin(t) - (h * sin(((a - b)/b) * t));
        vertex(x, y);
    }
    endShape();
}