hqq – secE – project 07 – curves

hamza

//hamza qureshi
//hqq@andrew.cmu.edu
//section e
//project 07 - curves

function setup(){
    createCanvas(480,480);
    angleMode(DEGREES);
}

function draw(){
    background(130,120,150);
    stroke(40,40,60);
    strokeWeight(0.25);
    noFill();
    translate(width/2,height/2); //moves shapes to center of canvas
    drawEpitrochoid(); //calls function to draw epitrochoid
    stroke(200,200,240);
    drawHypotrochoid(); //calls function to draw hypotrochoid
}

function drawEpitrochoid(){
    var p = width/2; //variable to call bounds of rotational shift
    var a = map(mouseX,0,width,0,40); //remaps x-value of mouse location to adjust center diameter
    var b = map(mouseY,0,height/2,0,80); //remaps y-value of mouse location to adjust radius of petals
    var h = 75; //number of lines
    beginShape();
    for (var i = 0; i < p; i++){
        var t = map(i,0,mouseX/30,0,360); //remaps i-value to correspond angularly
        var x = (a + b) * cos(t)-h*cos(t*(a+b)/b); //equations for epitrochoid
        var y = (a + b) * sin(t)-h*sin(t*(a+b)/b);
        vertex(x,y);
        endShape();
    }
}

function drawHypotrochoid(){
    var p = width/2;//variable to call bounds of rotational shift
    var a = map(mouseX,0,width,0,10); //remaps x-value of mouse location to adjust center diameter
    var b = map(mouseY,0,height/2,0,20);//remaps y-value of mouse location to adjust radius of petals
    var h = 50;//number of lines
    beginShape();
    for (var i = 0; i < p; i++){
        var t = map(i,0,mouseX/15,0,360); //remaps i-value to correspond angularly
        var x = (a + b) * cos(t) + h*cos(t*(a+b)/b);//equations for hypotrochoid
        var y = (a + b) * sin(t) - h*sin(t*(a+b)/b);
        vertex(x,y);
        endShape();
    }
}

In my exploration of a dynamic image using curve functions, I chose to draw an epitrochoid and a hypotrochoid. I appreciated the fact that both shapes are essentially inverses of each other. I wanted to also work the algorithms so that one would sit within the other, but the smaller one would increase in size less exponentially than the larger one. This creates an interesting sequence of shapes that produces a variety of silhouettes of the outer curve shape while maintaining a consistently shaped interior shape.