Project 4: String Art

/*
 * Andrew J Wang
 * ajw2@andrew.cmu.edu
 * Section A
 *
 * This program draws line arts
 */

var maxNum = 30;


function setup() {
    createCanvas(400, 300);
    background(0);
}

function draw() {
    background(0);
    //using the 3 functions for 3 different shapes
    backgroundStrings (50);
    stroke(255);
    circleStrings(200,150,200,500);
    stroke(255,0,0,255);
    circleStrings(200,150,100,58);
    push();
    fill(255);
    ellipse(200,150,100);
    pop();
    stroke(255,0,0,255);
    hexagonStrings(200,150,100,5,10);
    
}

function circleStrings(Cx,Cy,Cd,Cl) {
    for (var k = 0; k < maxNum; k++)
    {   
        //grabing points on the circle
        y=sin((k*(360/maxNum))*Math.PI/180)*(Cd/2)+Cy;
        x=cos((k*(360/maxNum))*Math.PI/180)*(Cd/2)+Cx;
        //making lines that is perpandicular to the radius with adjustable lengths
        p1X = x + cos(-(Math.PI/2-(k*(360/maxNum))*Math.PI/180))*Cl;
        p1Y = y + sin(-(Math.PI/2-(k*(360/maxNum))*Math.PI/180))*Cl;
        p2X = x - cos(-(Math.PI/2-(k*(360/maxNum))*Math.PI/180))*Cl;
        p2Y = y - sin(-(Math.PI/2-(k*(360/maxNum))*Math.PI/180))*Cl;
        line (p2X,p2Y,p1X,p1Y);
    }
}


function hexagonStrings(Hx,Hy,Hd,num,seg) {
    //make arrays
    const array = [];
    var angle = 360/num;
    for (var k = 0; k < num; k++)
    {   
        array[k] = new Array();

        y=sin(-Math.PI/2+(k*angle)*Math.PI/180)*(Hd/2)+Hy;
        x=cos(-Math.PI/2+(k*angle)*Math.PI/180)*(Hd/2)+Hx;
        line (Hx,Hy,x,y);
        
        for (var s = 0; s<seg; s++)
        {   
            //3D array grabing every points on the line of the star
            array[k][s] = new Array();
            var y1=sin(-Math.PI/2+(k*angle)*Math.PI/180)*(Hd/2)*s/seg+Hy;
            var x1=cos(-Math.PI/2+(k*angle)*Math.PI/180)*(Hd/2)*s/seg+Hx;
            array[k][s][0] = x1;
            array[k][s][1] = y1;

        }
    }

    //cross connecting those lines using for loop
    for (var k = 0; k < num-1; k++)
    {
        for (var s = 0; s<seg; s++)
        {
            line(array[k][s][0],array[k][s][1],array[k+1][seg-1-s][0],array[k+1][seg-1-s][1]);
        }
    }
    for (var s = 0; s<seg; s++)
    {
        line(array[num-1][s][0],array[num-1][s][1],array[0][seg-1-s][0],array[0][seg-1-s][1]);
    }

}

function backgroundStrings (num) {
    for (var k=0; k<num; k++)
    {
        //cross connecting with for loop
        stroke(255/num*k,0,0,255);
        line (k*width/num,0,width,k*height/num);
        line (width-k*width/num,height,0,height-k*height/num);
        line (k*width/num,height,width,height-k*height/num);
        line (width-k*width/num,0,0,k*height/num);
    }
}

Leave a Reply