Sarah Kang – Project-04-String Art

string

//sarah kang
//section c
//sarahk1@andrew.cmu.edu
//project-04-string art


//for center diamond
var r = 255;
var g = 125;
var b = 175;

//for intermediate rays
var rr = 255;
var gg = 196; 
var bb = 179;

//for corner rays
var rrr = 255;
var ggg = 253;
var bbb = 232;

//canvas
var W = 400;
var H = 300;

function setup() {
    createCanvas(W, H);
}

function draw() {
    background(0);

    strokeWeight(1);

    //center diamond
    for (var i = 0; i < W; i += 10) {
        line(i, H / 2, W / 2, H - (0.8 / i));
        stroke(r, g, b);

        line(W / 2, 0.8 / i, i, H / 2);
        stroke(r, g, b);
    } 

    //intermediate rays
    for (var i = 0; i < W; i += 30) {
        line(W, 0.8 / i, i, H / 2);
        stroke(rr, gg, bb);

        line(i, H / 2, W, H - (0.8 / i));
        stroke(rr, gg, bb);

        line(0, 0.8 / i, i, H / 2);
        stroke(rr, gg, bb);

        line(i, H / 2, 0, H - (0.8 / i));
        stroke(rr, gg, bb);
    }

    //corner rays
    strokeWeight(0.3);
    for (var i = 0; i < W; i += 5) {
        line(i, H / 2, mouseX, H - (0.8 / i));
        stroke(rrr, ggg, bbb);

        line(mouseX, 0.8 / i, i, H / 2);
        stroke(rrr, ggg, bbb);

        line(i, H / 2, W - mouseX, H - (0.8 / i));
        stroke(rrr, ggg, bbb);

        line(W - mouseX, 0.8 / i, i, H / 2);
        stroke(rrr, ggg, bbb);
    }
}

It was pretty confusing at first when figuring out how the variables were controlled and changed, but after playing around with different options, I finally got the hang of the basic inputs.