Here
is a hinged Truchet tiling with smoothly inserted curves.
Another is
here.
Because of the smooth and continuous nature of the transformation, we can iterate at
different rates across the image.
In the Webgl code for the following
image it is a bit of a pain to get colours to be transformed nicely to the
added tiles each time the iteration step increases, so this image only
iterates about two steps.
Also it only rotates in one direction.
The difference between the code for this program and the
one on page 8 is that for those ones,
each tile, including all added tiles, is a distinct primative
shape, and there is no change to the design on these, all the
work is on the vertex shader. Whereas for the program on this
page, all the work is in the shader; the number of primative tiles
is fixed, and the design on each tile changes.
In the end, I rewrote and used a different method,
here.
Transformation rule
The transformation rule, which can be used repeatedly, can be described by the following pictures.
The squares can rotate either clockwise or anti clockwise, and must rotate in the opposite direction from
their neighbours. So there are two choices of transformation.
I call squares odd or even, because that's what I use when programming,
but you could call them black or white, just anything to distinguish neighbours from each
other, so there is a chequer board arrangement. After the transformation, there are new squares, so a new
chequer board colouring. The colouring is only to keep track of which squares are odd or even.
Tiles have two possible orientations, (turn by 90 degrees or not) and two possible locations, either on odd or even
squares. So there are four kinds of tiles, and we need to say how each is transformed.
Here are the two transformation rules.
