let w = 900, h = 900; let s = 10; let c = 800; let xArr = []; let yArr = []; let pal = ['#ECAA9C','#B1D1C6', '#2E5B8B', '#F2CA60', '#d4c7a3', '#DE7830', '#513C2C', '#1F3858', '#C9292E', '#bfb8a3']; function mousePressed() { redraw(); } function setup() { createCanvas(w, h); pixelDensity(2); noLoop(); smooth(); colorMode(HSB, 360, 100, 100, 100); strokeCap(ROUND); shuffle(pal, true); c1 = color(pal[0]); c1.setAlpha(80); c2 = color(pal[1]); c2.setAlpha(80); c3 = color(pal[2]); c3.setAlpha(80); c4 = color(pal[3]); c4.setAlpha(80); } var c1, c2, c3, c4; function drawArrowA() { noStroke(); var cc = color(getColor()); cc.setAlpha(70); fill(cc); triangle(10,0,-10,0,0,50); } function drawArrowB() { noStroke(); var cc = color(getColor()); cc.setAlpha(90); fill(cc); ellipse(0,10,10,50); } function drawArrowC() { noStroke(); var cc = color(getColor()); cc.setAlpha(90); fill(cc); circle(0,10,20); cc = color(getColor()); cc.setAlpha(90); fill(cc); circle(0,10,10); } function drawArrowD() { var cc = color(getColor()); cc.setAlpha(70); noFill(); stroke(cc); triangle(10,0,-10,0,0,50); bezier(0,50, random(60), random(60,90),random(-60), random(60,90), 0,random(90, 140)); } function drawArrowE() { var cc = color(getColor()); cc.setAlpha(70); noFill(); stroke(cc); circle(0, 30, 10); circle(0, 40, 10); circle(0, 50, 10); circle(0, 60, 10); circle(0, 70, 10); } function drawArrow() { var d = random(); if (d < 0.3) { drawArrowA(); } else if (d < 0.4) { drawArrowB(); } else if (d < 0.6) { drawArrowC(); } else if (d < 0.7) { drawArrowD(); }else if (d < 0.8) { drawArrowE(); } } function draw() { background(220); var nx, ny, mx, my, n, m, r; var dr = 270; var theta = TWO_PI / c; var dx1, dy1, dx2, dy2, k = 1.25; drawGrids(); var cd; var al = 0; var dir; push(); translate(w/2, h/2); noFill(); for(let i = 0; i < c; i++) { var l = random(); if(l < 0.6) { r = dr * random(0.7, 1.0); } else if(l < 0.8) { r = dr * random(0.5, 0.75); } else { r = dr * random(0.2, 0.55); } n = int(random(c/2)); nx = r*cos(theta*n); ny = r*sin(theta*n); m = int(random(c/2, c)); mx = r*cos(theta*m); my = r*sin(theta*m); nv = createVector(nx, ny); mv = createVector(mx, my); // dx1 = random(-r/k, r/k); // dy1 = random(-r/k, r/k); // dx2 = random(-r/k, r/k); // dy2 = random(-r/k, r/k); n = int(random(c/2, c)); dx1 = r*cos(theta*n); dy1 = r*sin(theta*n); m = int(random(c/2)); dx2 = r*cos(theta*m); dy2 = r*sin(theta*m); cd = color(getColor()); al = map(i, 0, c-5, 5, 40); cd.setAlpha(al); noFill(); stroke(cd); bezier(nx, ny, dx1, dy1, dx2, dy2, mx, my); push(); translate(nv.x, nv.y); rotate(nv.heading()-PI/2); drawArrow(); pop(); push(); translate(mv.x, mv.y); rotate(mv.heading()-PI/2); drawArrow(); pop(); } pop(); drawFrame(); } // ------------------------------------- // // ------------------------------------- // // ------------------------------------- // function drawGrids() { stroke(0,0,10,100); strokeWeight(1.5); noFill(); var tx = int(w / s); var ty = int(h / s); for(let i = 0; i < ty; i++) { cy = i * s; for(let j = 0; j < tx; j++) { cx = j * s; point(cx, cy); } } } function drawFrame() { var s = 10; rectMode(CENTER); noStroke(); fill(220); rect(s*2-1, h/2, s*4, h); rect(w-s*2+1, h/2, s*4, h); rect(w/2, s*2-1, w, s*4); rect(w/2, h-s*2+1, w, s*4); } function getColor() { var l = pal.length; var cc = random(); shuffle(pal, true); if(cc < 1/l) { return pal[0]; } else if (cc < 2/l + .05) { return pal[1]; } else if (cc < 3/l - .03) { return pal[2]; } else if (cc < 4/l + .05) { return pal[3]; } else if (cc < 5/l - .02) { return pal[4]; } else if (cc < 6/l + .06) { return pal[5]; } else if (cc < 7/l + .02) { return pal[6]; } else if (cc < 8/l - .01) { return pal[7]; } else if (cc < 9/l + .02) { return pal[8]; } else { return pal[9]; } }