I was wondering whether there is an algorithm for getting the coordinates of circles like on an Apple Watch.

I would like to have a function that I enter the number of circles I would like. Then it loops round the origin in a hexagonal fashion adding the circles. For example if I input 6 the following image is produced.

enter image description here

Apple Watch Circles design


Solution 1: templatetypedef

One way to do this would be to formulate this as a graph search problem. Imagine making a graph of hexagons, with the center hexagon at (0, 0). To find the positions of the n hexagons you want, run a BFS-like algorithm as follows:

  1. Seed a queue with the point (0, 0), adding it to the list of points.
  2. While fewer than n points have been generated:
    1. Dequeue a point from the queue.
    2. For each of its six hexagonal neighbors, if that point hasn’t yet been generated, generate it and add it to the queue.

The math of going from a hexagon to its neighbor is mostly trig; just move d units at 60n° for n = 0, 1, …, 5.

To ensure that you have things radiating out from the center, when visiting the neighbors or a point, consider sorting them clockwise or counterclockwise around the perimeter of the hexagon.