# Inspired by the chaos game

## Looking for the chaos

Reading about chaos theory and fractals, I discovered a family of
algorithms known as **chaos game**.
The term
“chaos game”
refers to a method of creating fractals, using a polygon and a
point selected at random inside it.
The chaos game is an iterative algorithm, it draws points in the
canvas iteratively, therefore GLSL is not the appropriate language
for this kind of artwork, the canvas APIs would be a more natural
choice. Nevertheless, I want to practice with GLSL and so I went on
with it.

## A GLSL algorithm inspired by the chaos game

The algorithm I came in, strictly speaking, is not the chaos game.
As with the chaos game, it starts with a polygon `V`

,
defined as a list of `vec2`

points in the set
`S = [0, 1] x [0, 1]`

, and a further point
`p`

in the same set. Given the point `p`

and
the polygon `V`

, the algorithm returns a point
`v`

in `V`

, i.e. one of the polygon vertices.
The returned vector `v`

determines the colour of the
pixel at position `p`

. Therefore, if the polygon
`V`

has `N`

vertices, the resulting image will
have *at most* `N`

colours.

## Find the polygon vertex nearest to a given point

The algorithm iterates a couple of steps for a fixed and predefined amount of times.

The first step finds the nearest vertex `v`

in
`V`

to a given point `p`

in `S`

. In
listing 1, `V`

is defined as a
regular polygon of `N`

vertices and the function
`nearest`

returns the nearest vertex `v`

to
the point `p`

given as argument.

## Calculate the initial point of the next iteration

The second step takes inspiration from the chaos game, the idea is
to define the *new initial point*
`p`

given the current initial point
_{1}`p`

and its nearest vertex `v`

.

I calculated the symmetric point of `v`

with respect to
`p`

, listing 2 shows the actual
calculation. Anyway, this is just one of many solutions and it could
be interesting to explore alternative functions.
Note that the new initial point is not guaranteed to fall in
`S`

.

At this stage, a new iteration starts with
`p`

as input point: we calculate the nearest
vertex _{1}`v`

and its symmetric point
_{1}`p`

. The number _{2}`M`

of iterations is fixed and the
algorithm returns a point `p`

.
_{M}

```
vec2 pm (vec2 p) {
vec2 z = p;
const int M = 5;
for(int i = 0; i < M; i++) {
z = nextPoint(z);
}
return z;
}
```

## Assign pixels colours in the fragment shader

It is time to assign the colour to the pixel at position
`p`

. Given `p`

, we calculate, for the last time, its nearest vertex. The nearest
vertex will define the red and green channels of the pixel colour.
_{M}

## Further explorations

The algorithm is open to further explorations, you can easily modify
the polygon vertices `V`

and the number of iterations
`M`

to see how the resulting artwork is affected.