六边形包装算法

Question

我正在尝试将六边形包装在更大的六边形中，如下所示：

对于这个例子，我有 5 个“孩子”放在我的“父亲”六边形中。

每次我有太多孩子时，我想减小孩子的大小（除以 3？），以存储更多的孩子，如图所示（忽略不良的位置质量）：

你有没有解决过这类问题？对于给定的六边形大小，我可以使用任何算法来确定每个新六边形的位置吗？

我见过很多圆形包装的这些算法，但没有看到六边形包装。

感谢您的帮助

Answer 1

我已经找到了我正在寻找的关于这个主题的内容： Algorithm to generate a hexagonal grid with coordinate system

感谢上面的链接，这是我用来生成网格的算法，itemCount 是您需要在网格上放置的十六进制数。

this.x 和 this.y 是主十六进制的来源。 this.radius 是主十六进制的半径，以 px 为单位。

generateHexGrid(itemCount) {
  let size = 0;
  let pushed = 0;

  /*
  `n` must be odd

    n | columns-per row sequence
    --+-------------------------
    3 | 2 3 2
    5 | 3 4 5 4 3
    7 | 4 5 6 7 6 5 4
    9 | 5 6 7 8 9 8 7 6 5
    */

  // This can be optimised to make it generic if you need more hexes
  if (itemCount <= 7) {
    size = 3;
  } else if (itemCount <= 19) {
    size = 5;
  } else if (itemCount <= 37) {
    size = 7;
  } else if (itemCount <= 61) {
    size = 9;
  }
  const radius = this.radius / size;
  const toReturn = [];
  const ang30 = 30 * (Math.PI/180);
  const xOff = Math.cos(ang30) * (radius);
  const yOff = Math.sin(ang30) * (radius);
  const half = Math.floor(size / 2);

  for (let row = 0; row < size; row++) {
    const cols = size - Math.abs(row - half);

    for (let col = 0; col < cols; col++) {
      const x = Math.ceil(this.x + xOff * (col * 2 + 1 - cols));
      const y = Math.ceil(this.y + yOff * (row - half) * 3);
      toReturn.push({
        x,
        y,
        radius,
      });
      pushed ++;
      if (pushed === itemCount) {
        return toReturn;
      }
    }
  }
  return toReturn;
}