Project 07 – JamesKatungyi

Project 07 – Composition with curves

jkatungy-project07-curves

//James Katungyi
//Section A 0900
//jkatungy@andrew.cmu.edu
//Assignment-Project-07



var n = 27;
var h = 24;
var a = 120;
var Rad = 500;
var t = 0;

//undulating ground
function Topo(){
    fill(200, 100, 0);
    beginShape();
    vertex(width, height - 60); //first vertex on right canvas edge
    for (var i = 0; i < 100; i++){
        t = map(i, 0, 100, 0, PI);
        var x = 300 + cos (t) * Rad;
        var y = sin (t) * Rad - 200;
        vertex(x,y); //vertices defined by curve
        //println(t);
        //println(i);
    }
    vertex(0, height - 60); //vertex on left canvas edge
    vertex(0, height); // lower left vertex
    vertex(width, height); // lower right vertex
    endShape(CLOSE)
    //println(t);
    //println(i);
}
function Hypocycloid(){
    var b = a / n;
    fill(250, 240, 240); //pink
    beginShape();
    for (var i = 0; i < 4000; i++){
        var t = map(i, 0, 4000, 0, TWO_PI*n);
        var x = (a - b) * cos (t) + h * cos ((a - b) * t / b);
        var y = (a - b) * sin (t) - h * sin ((a - b) * t / b);
        vertex(x, y);
    }
    endShape(CLOSE);
}

function setup(){
    createCanvas(600, 400);
}
function draw(){
    background(200, 225, 250);//blue background
    Topo();//undulating ground function
    //mouseX as for canvas translation position
    var locX = map(mouseX, 0, width, 120, 480);
    //relate y value to x along the circle
    var y = sqrt((Rad * Rad) - (locX - 300) * (locX - 300)) - 200;
    //Angle R for canvas rotation as function of mouseX
    var AngleR = map(mouseX, 0, width, 0, PI);
    push();
    //translate canvas to mouseX position and topo y position
    translate (locX, y - 140);
    //rotate canvas relative to mouseX position
    rotate(AngleR);
    //call wheel - hypocycloid
    Hypocycloid();
    pop();
}

Using a hypocycloid, I made a wheel that rolls across the screen following the mouse but along a path defined by an arc. Working out the control parameters to follow the curved path proved difficult but was eventually resolved using the formula for cartesian coordinates of the points of the circle.

Leave a Reply