Project-04-String Art

sketch
// Emily Franco
// efranco
// Section C

//num of string lines
var numLines = 50;

//base lines
var dx1;
var dy1;
var dx2;
var dy2;

//string lines
var x1;
var y1;
var x2;
var y2; 

//counts sets of lines
var setCount = 0;

//line points
var lnx1; 
var lny1;
var lnx2;
var lny2;

//colors
r = 0; 
g = 0; 
b = 0;
function setup() {
    createCanvas(400, 300);
    background(220);
    text("p5.js vers 0.9.0 test.", 10, 15);
    background ("white");
}

function draw() {
	var halfW = width/2;
	var halfH = height/2;
	
	if (setCount == 0){
		//-----first line set--------
		lnx1 = 0; 
		lny1 = 0;
		lnx2 = width/10;
		lny2 = height-(height/12);
	}else if (setCount == 1){
		//-----second line set--------
		lnx1 = width/10; 
		lny1 = height-(height/12);;
		lnx2 = halfW;
		lny2 = height-(height/7);
	}else if (setCount == 2){
		//-----third line set--------
		lnx1 = halfW; 
		lny1 = height-(height/7);
		lnx2 = width-(width/6);
		lny2 = height-(height/2);
	}else if (setCount == 3){
		//-----fourth line set--------
		lnx1 = width-(width/6); 
		lny1 = height-(height/2);
		lnx2 = width-(width/3);
		lny2 = 0;
	}else if (setCount == 4){
		//-----fifth line set--------
		lnx1 = width-(width/3); 
		lny1 = 0;
		lnx2 = width/2;
		lny2 = height/8;
	}else if (setCount == 5){
		//-----fifth line set--------
		lnx1 = width/2; 
		lny1 = height/8;
		lnx2 = width/9;
		lny2 = height/9;
	}else if (setCount>5){
		//stop looping
		noLoop();
	}

	//generate random colors
	r = random (255);
	g = random (255);
	b = random (255);

	push();
	noStroke();
	//fill trangle between base lines
	fill (r,g,b,100);
	beginShape();
	vertex (lnx1,lny1);
	vertex (halfW,halfH);
	vertex (lnx2,lny2);
	endShape();
	

	//draw base lines
	line(halfW,halfH,lnx1,lny1);
	line(halfW,halfH,lnx2,lny2);

	pop(); 

	//get position increment for string line
	dx1 = (halfW-lnx1)/numLines;
	dy1 = (halfH-lny1)/numLines;
	dx2 = (lnx2-halfW)/numLines;
	dy2 = (lny2-halfH)/numLines;

	//reset string postions
	x1 = lnx1;
	y1 = lny1;
	x2 = halfW; 
	y2 = halfH;

	for (var i = 0; i<numLines; i+=1){
		//inverted stroke color
		stroke (255-r,255-g,255-b,150);
		//draw string lines
		line (x1,y1,x2,y2);
		x1 += dx1;
		y1 += dy1;
		x2 += dx2;
		y2 += dy2;
	}

	setCount += 1;
}

Leave a Reply