sketch// Jaden Luscher
// jluscher
// section A
// project 4: string art
// increments along lines
var dx1;
var dy1;
var dx2;
var dy2;
var dx3;
var dy3;
var dx4;
var dy4;
// line density
var numLines = 50;
// determines location / quadrant of strings1 function
// when mycount = 0, the top left quadrant is drawn
var mycount = 0;
function setup() {
createCanvas(400, 600);
background(200,200,0);
}
function draw() {
dx1 = (50-100)/numLines;
dy1 = (150-300)/numLines; // split up L1
dx2 = (200-200)/numLines;
dy2 = (250-50)/numLines; // split up M1
dx3 = (350-300)/numLines;
dy3 = (150-300)/numLines; // split up R1
dx4 = (350-50)/numLines; // split up horizontal line
dy4 = (600-0)/numLines/2; // split up long vertical (height)
// brown lines
push();
strokeWeight(0.2);
stroke("brown");
bgStrings(350, 300, 200, 0);
bgStrings(350, 300, 400, 0);
bgStrings(50, 300, 200, 0);
bgStrings(50, 300, 0, 0);
pop();
stroke(255);
strokeWeight(0.7);
outline(); // draw base lines (L1, M1, R1, L2, M2, R2)
push();
strings1(50, 150, 200, 250); // call function to connect L1 to M1
mycount = 1;
strings1(350, 150, 200, 250); // connect R1 to M1
translate(width, height); // flip canvas to mirror strings
rotate(PI);
mycount = 0; // reset to 0
strings1(50, 150, 200, 250); // L1 to M1
mycount = 1; // string1 uses "else" conditional do draw top right quadrant
strings1(350, 150, 200, 250); // R1 to M1
pop();
// lines at center of canvas (resemble parallelogram)
strings2(200, 250, 50, 300);
strings2(200, 350, 50, 300);
noLoop();
}
function outline() {
// top lines
line(50, 150, 100, 300); // L1
line(200, 250, 200, 50); // M1
line(350, 150, 300, 300); // R1
// bottom lines
line(50, 450, 100, 300); // L2
line(200, 550, 200, 350); // M2
line(350, 450, 300, 300); // R2
push();
strokeWeight(2);
line(width/2, 0, width/2, 250);
line(width/2, height, width/2, 350);
pop();
// other lines
line(0, height/2, width, height/2); // horizontal line
}
function bgStrings(a, b, x, y) {
for (var i = 0; i <= numLines*2; i += 1) {
line(a, b, x, y);
y += dy4;
}
}
function strings1(x1, y1, x2, y2) {
for (var i = 0; i <= numLines; i += 1) {
line(x1, y1, x2, y2);
if(mycount == 0) { // top left quadrant
x1 -= dx1;
y1 -= dy1;
x2 -= dx2;
y2 -= dy2;
} else { // top right quadrant
x1 -= dx3;
y1 -= dy3;
x2 -= dx2;
y2 -= dy2;
}
}
}
function strings2(a, b, x, y) {
for (var i = 0; i <= numLines; i += 1) {
line(a, b, x, y);
x += dx4;
}
}
![[OLD SEMESTER] 15-104 • Introduction to Computing for Creative Practice](../../../../wp-content/uploads/2023/09/stop-banner.png)
