/** * color pallet */ // let pal = ["#555233","#DF921D","#878937","#CFC52A","#DC2A41"]; // let pal = ["#003049","#d62828","#f77f00","#fcbf49","#eae2b7"]; let pal = ["#820263","#d90368","#eadeda","#2e294e","#ffd400"]; // let pal = ["#306b34","#1c5253","#f3ffc6","#c3eb78","#b6174b"]; // let pal = ["#ef6461","#e4b363","#e8e9eb","#e0dfd5","#313638"]; let bgColor; let seed; let TIME_STEP = 2; let cx, cy, r, pid; let num; function setup() { createCanvas(windowWidth, windowHeight); colorMode(HSB, 360, 100, 100, 100); angleMode(DEGREES); background(255); // noLoop(); // frameRate(240); textSize(width / 10); textAlign(CENTER, CENTER); let cid = int(random(pal.length)); bgColor = pal[cid]; pal.splice(cid, 1); shuffle(pal); seed = random(1e+4); cx = []; cy = []; r = []; pid = []; num = 300; initPos(); background(bgColor); effect(); // noise effect } function draw() { background(bgColor); // clear auto randomSeed(int(second() / TIME_STEP)); initPos(); for (let i = 0; i < num; i++) { strokeWeight(2); stroke(random(pal)); line(cx[i], cy[i], cx[pid[i]], cy[pid[i]]); } for (let i = 0; i < num; i++) { drawCell(cx[i], cy[i], r[i], random(pal)); } // effect(); // drawWindow(); } function drawCell(x, y, rad, c) { let mode = int(random(3)); push(); translate(x, y); switch(mode) { case 0: for (let i = 0; i < 6; i+=2) { let col = color(bgColor); col.setAlpha(50); strokeWeight(rad * 0.05); stroke(bgColor); fill(c); circle(0, 0, map(i, 0, 6 - 1, rad * 2, rad * 0.25)); strokeWeight(rad * 0.05); stroke(bgColor); fill(col); circle(0, 0, map(i+1, 0, 6 - 1, rad * 2, rad * 0.25)); } break; case 1: let c1 = color(c); c1.setAlpha(50); strokeWeight(rad * 0.05); stroke(bgColor); fill(c1); circle(0, 0, rad * 2); let c2 = color(c); strokeWeight(rad * 0.05); stroke(bgColor); fill(c2); circle(0, 0, rad * 2 * 0.2); break; case 2: strokeWeight(rad * 0.05); stroke(bgColor); fill(c); circle(0, 0, rad * 2); rotate(random(360)); strokeWeight(rad * 0.1); stroke(bgColor); for (let i = 0; i < 180; i+= 20) { line(cos(i) * rad, sin(i) * rad, cos(-i) * rad, sin(-i) * rad); } break; } pop(); } function initPos() { let maxRad = min(width, height) / 10; for (let j = 0; j < num; j++) { // center point (outside each other) let bOutside = false; while (!bOutside) { cx[j] = random(width); cy[j] = random(height); bOutside = true; for (let i = 0; i < j; i++) { if (dist(cx[i], cy[i], cx[j], cy[j]) < r[i]) { bOutside = false; break; } } } // radius (not overlap) pid[j] = j; let d = 1e+4; for (let i = 0; i < j; i++) { // d = min(d, dist(cx[i], cy[i], cx[cnt], cy[cnt]) - r[i]); if (d > dist(cx[i], cy[i], cx[j], cy[j]) - r[i]) { d = dist(cx[i], cy[i], cx[j], cy[j]) - r[i]; pid[j] = i; } } if (d < maxRad) { r[j] = d; } else { r[j] = maxRad; } } } function effect() { strokeWeight(1); for (let i = 0; i < width * height * 5 / 100; i++) { stroke(0, 0, 0, 10); let px = random(width); let py = random(height); point(px, py); } } function drawWindow() { w = width / 30; noStroke(); fill(255); rect(0, 0, width, w); rect(0, height - w, width, w); rect(0, 0, w, height); rect(width - w, 0, w, height); }