const colors2 = ['#bf373e','#f8ffef','#3d6271'];

const colors3 = ['#303241','#4a5573','#eac203'];

const colors4 = ['#0389ae','#7b0221','#d97841'];

const colors5 = ['#106991','#abb8c9','#c8430b'];

const colors = [colors1,colors2,colors3,colors4,colors5];

​

const w = 600;

const h = 600;

const num = 3000; // 試行回数

let circles;

let circles2;

​

const colorBox = [];

​

function setup() {

  createCanvas(800, 800);  

  circles = getRandomCircles(num, w * 0.4, h * 0.4);

  circles2 = getRandomCircles(num, w * 0.4, h * 0.4);

}

​

function draw() {

  background(220);

  translate(width/2,height/2);

  push();

  noStroke();

  for(let i =0;i<circles.length;i++){

    tris(circles[i].x, circles[i].y, circles[i].z/1, colorBox[i], true);

  }

  pop();

  push();

  noFill();

  stroke(colors[1]);

  strokeWeight(3);

  circles.forEach((c) => tris(c.x + 5, c.y - 5, c.z, colors1, false));

  pop();

  noLoop();

}

​

keyPressed = () => {

  if (key === 's') {

    saveCanvas(canvas, 'canvas', 'png');

    //saveGif('canvas', 2);

  }

};

​

function getRandomCircles(_num, _w, _h) {

  let circles = [];

  for (let i = 0; i < _num; i++) {

    let x = random(-1, 1) * _w;

    let y = random(-1, 1) * _h;

    let z = random(70, 200); // z軸の値を円の大きさとして使用

    if (circles.every((c) => dist(x, y, c.x, c.y) > (z + c.z) * 0.5)) {

      circles.push(createVector(x, y, z));

    }

    const rand = Math.floor(random(colors.length));

    colorBox.push(colors[rand]);

  }

  return circles;

}

​

const tris = (x,y,r,colors,isFill) =>{

  const num = 3;

  const rr = r/2;

  const angle = 360/num;

  push();

  translate(x,y);

  for(let i =0;i<num;i++){

    const xx = rr * cos(radians(angle * i));

    const yy = rr * sin(radians(angle * i));

    if(isFill) fill(colors[i]);

    hexagon(xx,yy,r*0.8);

  }

  pop();

}

​

const hexagon = (x,y,r) =>{

  const num = 6;

  const rr = r/2;

  const angle = 360/num;

  push();

  translate(x,y);

  beginShape();

  for(let i =0;i<num;i++){

    const xx = rr * cos(radians(angle * i));

    const yy = rr * sin(radians(angle * i));

    vertex(xx,yy);

  }

  endShape(CLOSE);

  pop();

}