<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>flower1</title>
<script src="../libraries/p5.min.js" type="text/javascript"></script>
<style> body {padding: 0; margin: 0;} canvas {vertical-align: top;} </style>
<script>
let a = [0, 1, 2, 3, 4, 5, 6, 7, 8];
let glyphSize = 10;
function setup() {
createCanvas(windowWidth,windowHeight);
}
function X(p) {
return glyphSize*(floor(p/3) + 1)
}
function Y(p) {
return glyphSize*(p%3 + 1)
}
function draw() {
frameRate(0.3);
background(240,230,140);
maxHowMany = floor(random(4,6));
minHowMany = floor(random(2,4));
sw = floor(random(3,5));
for (var i = 0; i < width-3*glyphSize; i += 3*glyphSize) {
for (var j = 0; j < height-3*glyphSize; j += 3*glyphSize) {
shuffle(a, true);
strokeWeight(sw);
let howMany = floor(random(minHowMany,maxHowMany));
for (let k = 0; k < howMany; k++) {
line(i + X(a[k]), j + Y(a[k]), i + X(a[k+1]), j + Y(a[k+1]));
}
}
}
}
</script>
</head>
<body>
</body>
</html>