​

function setup() {

  createCanvas(400, 400);

}

​

function draw() {

  background(220);

  push();

  translate(100,100);

  for(let j = 0; j < 5; j++){

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

      drawHexAtLoc(i,j);

    }

  }

  pop();

  noLoop();

}

​

​

function drawHexAtLoc(i,j){

  drawHex((i + (j % 2) / 2) * BASESZ  , (BASESZ*0.75) * j); 

}

​

function drawHex(x,y){

  const sz = BASESZ / 2;

  push();

  translate(x,y);

  //sides

  line(-sz,-sz/2,-sz,sz/2);

  line(sz,-sz/2,sz,sz/2);

  //top

  line(-sz,-sz/2,0,-sz);

  line(0,-sz,sz,-sz/2);

​

  //bottom

  line(-sz,sz/2,0,sz);

  line(0,sz,sz,sz/2);

  pop();

}