Project 7 – Curves

It slowly draws a butterfly if u move your mouse from left to right!

/*
 * Andrew J Wang
 * ajw2@andrew.cmu.edu
 * Section A
 *
 * This Program is ButterFly and Flower Curves
 */



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

function draw() {
    background(220);
//create constrain for the rest of the codes' mouse X and Y
    var conY = constrain(mouseY,0,height);
    var conX = constrain(mouseX,0,width);
//create two array sets for Flower's X and Y
    var pointX2 = [];
    var pointY2 = [];
//remapping A and B with mouse X and Y
//A => inner circle, B => outer circle 
    var a = map(conY,0,width,50,150);
    var b = map(conX,0,width,5,15);
    var h = 20;
//using for loop to get points
    for (var k=0; k<=2000; k+=1)
    {   
        //2 PI but 2000 points
        var t=k/1000*Math.PI;
        //epitrochoid formulas for X and Y
        var xP2= width/2+((a+b)*Math.cos(t)-h*cos(((a+b)/b)*t));
        var yP2= height/2+((a+b)*Math.sin(t)-h*sin(((a+b)/b)*t));
        //push values to lists
        pointX2.push(xP2);
        pointY2.push(yP2);
    }
//connect vertexes and close them
    push();
    noFill();
    //stroke
    stroke(0);
    strokeWeight(5);
    beginShape();
    for (var k=0; k<=2000; k+=1)
    {   
        vertex(pointX2[k],pointY2[k]);
    }
    endShape(CLOSE);
    pop();
//connect vertexes and close them
    push();
    //no stroke only fill
    fill(255,200,200);
    strokeWeight(0);
    beginShape();
    for (var k=0; k<=2000; k+=1)
    {   
        vertex(pointX2[k],pointY2[k]);
    }
    endShape(CLOSE);
    pop();
//same logics but this time it is the butterfly curves
    var pointX = [];
    var pointY = [];
    for (var k=0; k<=2400; k+=1)
    {   
        //Mouse Y dictate how big the butterfly will be
        var xP= width/2-map(conY,0,width,0,100)*Math.sin(k/100*Math.PI)*((Math.exp(Math.cos(k/100*Math.PI))) - (2*Math.cos(4*(k/100*Math.PI))) - (Math.pow(Math.sin((k/100*Math.PI)/12), 5)));
        var yP= height/2-map(conY,0,width,0,100)*Math.cos(k/100*Math.PI)*((Math.exp(Math.cos(k/100*Math.PI))) - (2*Math.cos(4*(k/100*Math.PI))) - (Math.pow(Math.sin((k/100*Math.PI)/12), 5)));
        pointX.push(xP);
        pointY.push(yP);
    }

//this time I use smaller circles to represent the curves
    fill (90,map(conY,0,width,0,255),100);
    stroke (90,map(conY,0,width,0,255),100);
    //mouse X dictates how many circles
    for (var k=0; k<=conX*4; k+=1)

    {
        circle (pointX[k],pointY[k],3);
    }
    }