Xindi Lyu-project 07- Curves-Section A

sketch

 
/*
Xindi Lyu
Section A
xindil@andrew.cmu.edu
*/


var nPoints = 100;
var HYPOCYCLOID = 1;
var EPICYCLOID = 0;
var curveMode = HYPOCYCLOID;

function setup() {
    createCanvas(500, 500);
    frameRate(10);
        }

 



function draw() {
    
    push();
    translate(250,250);
    switch (curveMode){
        case HYPOCYCLOID:
        drawHypocycloid();
        break;
        case EPICYCLOID:
        drawEpicycloid();
        break;
    }
    pop();


    }


function drawHypocycloid() {//drawcurve
    background(200,200+mouseX*0.1,200+mouseY*0.1);//make the changing background for Hypocycloid
    var x;
    var y;
    var a=map(mouseX, 0, 500, 1, 100);//size of the geometry
    var n=map(mouseX, 0, 500, 1, 15);//devision of thhe curve
    fill(200,150+mouseX*0.1,200+mouseY*0.1);//fill the geometry with changing color 
    
    stroke(0.4*mouseX+0.4*mouseY);//change the ourline color
    beginShape();
    for(var i=0; i<nPoints; i++){
        var t = map(i, 0, nPoints, 0, 2*PI);
        x=a*(((n-1)*cos(t)+cos((n-1)*t))/n);
        y=a*(((n-1)*sin(t)-sin((n-1)*t))/n);
        vertex(x+random(-5,5),y+random(-5,5));
    }
    endShape(CLOSE);
}



function drawEpicycloid() {//drawcurve
    background(200,150+mouseX*0.1,200+mouseY*0.1);//make the changing background for Epicycloid
    var x;
    var y;
    var a=map(mouseX, 0, 500, 1, 100);//size of the geometry
    var n=map(mouseY, 0, 500, 1, 15);//devision of thhe curve
    fill(200,200+mouseX*0.1,200+mouseY*0.1);;//fill the geometry with changing color 
    stroke(0.4*mouseX+0.4*mouseY);
    beginShape();
    for(var i=0; i<nPoints; i++){
        var t = map(i, 0, nPoints, 0, 2*PI);
        x=(a+n)*cos(t)-n*cos((a+n)/n*t);
        y=(a+n)*sin(t)-n*sin((a+n)/n*t);
        vertex(x+random(-5,5),y+random(-5,5));
    }
    endShape(CLOSE);
}

function mousePressed(){
    curveMode = 1- curveMode;//switch between geometries
}

For this project I experimented with two different types of curves and rendering them with the jittering effect to add a lively feeling to the image.

Leave a Reply