Nawon Choi— Project 04 String Art

nawon-project-04

// Nawon Choi
// nawonc@andrew.cmu.edu
// Section C
// Project 04 String Art


var a = 0;
var b = 300;
var c = 400;
var amt = 50;

var r = 500;
var x;
var y;
var x1;
var y1;

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

function draw() {
    // got help getting the points along a circle: 
    // (lines 27, 32, 33)
    // https://stackoverflow.com/questions/5300938/calculating-the-position-of-points-in-a-circle
    var slice = 2 * PI / amt;
    for (let i = 0; i < amt; i++) {
        // draw lines from points along the circle,
        // to points along the edge of the canvas
        var angle = slice * i;
        x = r * cos(angle) + a;
        y = r * sin(angle) + c;
        stroke("#37393b");
        line(x, y, i * 20, a);
    }

    // green and yellow lines
    for (let i = 0; i < (amt / 2); i++) {
        stroke("green");
        line(a, a, i * 20, c);
        var angle2 = slice * i * 2;
        x1 = r * cos(angle2) + a;
        y1 = r * sin(angle2) + c;
        stroke("yellow");
        line(x1, y1, i * 25, c);
    }

    // make lines that follow the mouse
    stroke("#a3afb5");
    line(b, a, mouseX, mouseY);
}

For this project, I mainly tried to experiment with different ways lines could be drawn. I initially played around with the way lines splay outward from a circle. I amplified this by playing around with the variables, magnifying the size of the circle and having it go off the canvas, creating the gray lines in the background. I added some green and yellow lines to add some visual interest, then added the lighter gray lines to add an interactive element.