<!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>