I tried to play with more “for loop” here while incorporating functions. It was a bit tough but with more practice I think I can move on to the more complex stuff – like arrays and classes.
* Demystify For Loop* The uncommented code is the same as the for loop below!
// line(0 + (0 * 20) , 0, (0 * 20) , height);
// line(0 + (0 * 20) , 0, (0 * 20) , height);
// line(0 + (1 * 20) , 0, (1 * 20) , height);
// line(0 + (2 * 20) , 0, (2 * 20) , height);
for (var i = 0; i < width/10; i++) {
line(0 + (i * 10) , 0, (i * 10) , height);
}
http://alpha.editor.p5js.org/embed/SymOZWj2b
I wanted to add a moving circle that animates vertically on its own to show the real effect of a moire pattern!