Lingfan Jiang – Project 04 – String Art

lingfanj-04

//Lingfan Jiang
//Section B
//lingfanj@andrew.cmu.edu
//Project-04


var dx; //x coordinate for points on curve
var dy; //y coordinate for points on curve
var circleDiameter; //diameter of the center circle


function setup(){
    createCanvas (400, 300);

}

function draw(){
    background(0);
    angleMode(DEGREES);
    strokeWeight(0.1); //set a lineweight for the bottom curves
    circleDiameter = 75;


    stroke(255,104,107); //red lines
    for (var x = 0; x < 95; x += 5) {
        dx = 200 + (circleDiameter * cos(x));
        dy = 150 + (circleDiameter * sin(x));
        //connect first quarter of the points on the circle with the points on the top
            for (var i = 0; i < 400; i += 5){
            line(i,0,dx,dy);  
        }
    }
    strokeWeight(0.08);
    stroke(27,179,244); //light blue lines
    for (var x = 90; x < 275; x += 5) {
        dx = 200 + (circleDiameter * cos(x));
        dy = 150 + (circleDiameter * sin(x));
        //connect half quarter of the points on the circle with the points on the left
            for (var i = 0; i < 300; i += 5){
            line(0,i,dx,dy);  
        }
    }
    strokeWeight(0.05);
    stroke(0,40,255); // dark blue lines
    for (var x = 180; x < 275; x += 5) {
        dx = 200 + (circleDiameter * cos(x));
        dy = 150 + (circleDiameter * sin(x));
        //connect quarter of the points on the circle with the points on the bottom
            for (var i = 0; i < 400; i += 5){
            line(i,300,dx,dy);  
        }
    }
    stroke(143,113,255);
    strokeWeight(0.04); // purple lines
    for (var x = 270; x < 455; x += 5) {
        dx = 200 + (circleDiameter * cos(x));
        dy = 150 + (circleDiameter * sin(x));
        //connect half quarter of the points on the circle with the points on the right
            for (var i = 0; i < 300; i += 5){
            line(400,i,dx,dy);  
        }
    }

    noLoop();
}

In this project, I had some difficulties to picture the final form at first. However, after looking through some of the string art examples, I became particularly interested in the circle from. Different from architectural modeling software, you cannot evaluate curves and find points on them. Therefore, the coordinates of the points that form a circle gave me a little bit of trouble. After understanding how “cos” and “sin” could help form it, here is the final result.