Apollonian gasket as a fractal in tiled hyperbolic space

Reading the fascinating book « Indra`s Pearls », written by David Mumford, Caroline Series and David Wright, you discover that the Apollonian gasket can be created by multiple inversions at four touching circles. Three of the circles are of equal size. The points lying outside these circles belong to two different regions. One lies in between the circles. It is a hyperbolic triangle with vanishing angles. The second region surrounds the circles and is an inverted image of the first region. It includes the point at infinity. We get a hyperbolic tiling of the plane by multiple inversion in these three circles. For each pixel we take its position and invert it at any circle if it lies inside. We repeat this until the position lies outside of all three circles. Then we colour the pixel depending on the number of reflections and its final position. We get this :

Blue colours : Poincaré disc representation of a tiled hyperbolic space. Yellow : Surrounding inverted disc. The generating circles are shown in black.

Here pixels that are mapped into the inner triangle get a light blue colour for an even number of reflections and a dark blue colour for an odd number. Pixels going to the outer inverted triangle are similarly coloured in light and dark yellow. In blue colours we see a Poincaré disc representation of tiled hyperbolic space inside an inverted disc of the same geometry in yellow colours.

We get a generator for the Apollonian gasket by adding a fourth circle inside the inner triangle. The fourth circle touches the three outer circles. Note that this cuts the inner triangle into three smaller triangles. Each of them has this additional circle as one of its sides and two of the three larger circles as other sides. Repeated inversion on the sides of one of the small triangles creates a Poincaré disc representation of tiled hyperbolic space similarly as for the figure above. Inversion in the three larger circles makes an inverted Poincaré disc, which is shown in blue in the above figure. By the way, this inverted disc is also neeeded for the tetrahedral symmetry of the Apollonian gasket. Thus we get four basic discs as building blocks. Inversion in all four circles generates infinitely many images of these discs. They cover the yellow disc of the above figure. It is important that the number of inversions becomes infinite at the border of each of these discs. Thus, we can approximate the Apollonian gasket by colouring those pixels that require many inversions. Superimposing on the image above we get :

Apollonian gasket shown in black. It is generated by inversion in the circles shown in green. Blue and yellow : Poincaré disc representations of tiled hyperbolic space generated by the three larger circles.

We see that the Apollonian gasket nicely fits the tiled space as each hyperbolic triangle is decorated by the same fractal triangle. By the way, these triangles have a close similarity to the Sierpinsky triangle. Note that the projection of hyperbolic space into the Euclidean drawing plane distorts the tiles and their decorations in the same way.

To see how the Apollonian gasket is composed of discs representing hyperbolic spaces, we can colour the pixels depending on the triangle its position gets mapped to and on the number of inversions used. Using red, green and blue for the inner triangles and yellow for the surrounding inverted one we get :

The Apollonian gasket as a covering of the plane with discs representing tiled hyperbolic space. Discs of the same colour are images of each other. White lines show the circles generating the gasket. Black pixels indicate the borders of the discs.

Note that discs touching each other never get the same colour. Discs of the same colour are inverted images of each other. Their tilings are all the same and they only appear to be different. That’s because of the inversion mapping.

The Cayley transform changes the Poincaré disc into a Poincaré plane representation of hyperbolic space. Actually, an inversion in a circle that has its center on the border of the gasket gives an equivalent result. Applying it to the figure that superimposes the gasket and the embedding hyperbolic space, we get :

Poincaré plane representation of hyperbolic space decorated with an Apollonian gasket.

The triangles of the tiling again match the Apollonian gasket. In comparison, their sizes vary much stronger than in the figure above. Thus, at first sight the decorations of the tiles seem to be different. But this is only an effect of their different sizes. Because of the fractal nature of the gasket we see more or less details resulting in a different appearance. Again, we can show the discs of the gasket in more detail :

Poincaré plane representation of an Apollonian gasket made of discs and two planes representing tiled hyperbolic space.

Note that in this image we see the gasket as a periodic frieze resulting from mirror images in two vertical lines and inversions in a string of touching circles.

I conclude that the Apollonian gasket is a fractal covering of a tiled hyperbolic space by Poincaré disc representations of hyperbolic space. But this is only one of its many faces.

Posted in Fractals, Kaleidoscopes, Tilings | Tagged , , , , | Leave a comment

Apollonian gasket as a spherical fractal with tetrahedral symmetry

Before discussing the relation between the Apollonian gasket and tilings of the sphere, I want to present briefly the spherical kaleidoscope with tetrahedral symmetry.

A tetrahedron has three different kinds of points with rotational symmetry. Four equilateral triangles make up the tetrahedron. It has three-fold rotational symmetry with respect to the points lying at the center of triangles. Another set of points with the same rotational symmetry is made of the points at the corners of the triangles, where three triangles meet. Points of two-fold rotational symmetry lie in the middle of the sides of the triangles.

Note that reflections in two mirrors that intersect at an angle of 180/n degrees result in an n-fold rotational symmetry. Thus, a kaleidoscope with three planar mirrors makes an image with tetrahedral symmetry if its angles between the mirrors are 90 degrees and twice 60 degrees. These mirrors are not parallel, instead they make up a pyramid. To create a two-dimensional image with these symmetries, we replace the mirrors by mirror lines and the kaleidoscope becomes a triangle. However, the sum of its angles is 210 degrees. This is larger than 180 degrees and thus it is a spherical triangle. At least one of its sides has then to be a circle arc instead of a straight line.

To get the kaleidoscopic image we repeatedly mirror the position of a pixel at straight lines and invert it at circle arcs until it lies inside the kaleidoscopic triangle. The colour of the pixel can depend on the number of reflections and on its final position. A typical result for the tiling generated by the kaleidoscope looks like this :

Stereoscopic projection of the spherical tiling with tetrahedral symmetry.

The solid black lines mark the kaleidoscopic triangle. To show the structure of the tiling I coloured pixels already lying inside the triangle in light yellow. Pixels needing an even number of reflections to get into the triangle are shown in primary yellow and dark yellow shows those with an odd number. Here you can see how images of the kaleidoscopic triangle are put together to cover the entire plane. Isn’t it surprising that the triangles have such different shapes and sizes ? Shouldn’t they all be equal ?

What you actually see is a stereographic projection of the tiled sphere. This projection causes strong distortions. The tiled sphere can better be recognized in a normal projection. To show this, we first make an inverse stereographic projection from the plane to the sphere. The dashed line in the figure above shows the equator of the sphere. Its inside gets projected to the lower hemisphere with the south pole at its center. The south pole corresponds to the intersection point of the straight lines. The outside of this circle goes to the upper hemisphere having the north pole at its center. Stereographic projection maps the north pole to infinity in the plane. We now see that all triangles of the tiling have really the same shape :

Normal projection of the tiled sphere. Lower hemisphere at left, upper at the right. Both as seen from above.

These images are somewhat underwhelming and we do not even see any difference between the points of three-fold rotational symmetry! We get more interesting kaleidoscopic images from patching a part of a photography on the triangles. For each output pixel we simply read the colour of the input photography at the mapped position of the pixel position inside the kaleidoscopic triangle. This is an example :

Stereographic projection of a sphere covered by a kaleidoscopic image with tetrahedral symmetry. Solid white lines show the kaleidoscopic triangle. The dashed line is the projected equator.

We now see a difference between the two kinds of points with three-fold rotational symmetry. Some points lie inside a grey shape and the other points lie inside a dark brown shape. The distortion of the stereographic projection appears to be even more pronounced in this image. Again, the normal projections of the decorated sphere show the symmetries and equivalencies much better :

Normal projection of the sphere with a kaleidoscopic image. Lower hemisphere at left, upper at the right. Both as seen from above.

The Apollonian gasket too is a decoration of the tiled sphere. It results from multiple reflection similar to the tetrahedral tiling. Adding a circle to the kaleidoscopic triangle we get :

Stereographic projection of the tiled sphere together with an Apollonian gasket. Solid green lines show the generating elements. The dotted line is a projection of the equator.

Now, reflections at the two lines and two circles are repeated until a point gets mapped into the small triangle made of two circles and one straight line. This triangle has two angles of 60 degrees and an angle of 0 degrees. It is a hyperbolic triangle, because the sum of its angles is less than 180 degrees. On itself, it would only create a Poincaré disc representation of a tiled hyperbolic space. All four reflecting elements together make a fractal covering of the entire plane by non-overlapping images of this disc. The image above shows essentially the borders of those discs superimposed on the tetrahedral tiling. I am using that the number of reflections required to map a point into the kaleidoscopic triangle becomes infinite at the border of the discs. Thus pixels are shown in black if they require more than a certain number of reflections. This indicates the borders.

In normal projection we see the symmetry of the gasket much better:

Normal projection of the Apollonian gasket on a sphere. Lower hemisphere at left, upper at the right.

This view shows that each triangle really bears the same decoration.

We get more from these images if we relate them to the standard way of drawing the Apollonian gasket. It starts with a single circle. Then, three circles of equal radius are drawn inside this circle, touching each other and also the first circle. You can easily identify these four circles in the two figures above. Note that they all have the same size in the normal projection. Their centers lie on points of three-fold rotational symmetry. All these points lie in the grey shapes of the other kaleidoscopic image. One of these points is the north pole of the sphere and does not appear in the stereoscopic image. Note that there are four triangular gaps between the four circles. The all have the same size and shape in the normal projection. In a second step, a circle is drawn inside each of these gaps such that it touches its borders. The centers of these circles lie at other points of three-fold rotational symmetry. In the other kaleidoscopic image, they are in the center of the dark brown shapes. One of these points is the south pole of the lower hemisphere. These additional circles leave more gaps, which are filled again in the same manner. Repeating this procedure gives the same fractal decoration for all triangles of the tetrahedral tiling, as you can see in the images above.

We get a nice and instructive image if we draw the sphere as a black shadow with the Apollonian gasket in light colour. It shows how the two hemispheres fit together :

Normal projection of the Apollonian gasket. Lower hemisphere in pale blue and upper hemisphere in pale yellow.

To get another view of the Apollonian gasket we rotate the sphere, such that a point of two-fold rotational symmetry lies at the north pole and another one at the south pole. This results in an Apollonian gasket, that looks like a fractal decoration of an Euclidean frieze :

Stereographic projection of the rotated tiled sphere together with an Apollonian gasket.

This periodic repetition is an effect of the distorting stereographic projection. Note that the parallel lines and the periodicity do not match the tiling of the sphere. In the normal projection we see that the sphere is really only rotated :

Normal projection of the Apollonian gasket on a sphere. Lower hemisphere at left and upper at the right.

The combined view shows that now the upper and lower hemispheres have the same decoration up to a rotation by 90 degrees :

Normal projection of the Apollonian gasket. Lower hemisphere in pale blue and upper hemisphere in pale yellow.

I have made all these images using my public browser app at http://geometricolor.ch/circleInTriangle.html and with a little help of GIMP. Try out this browser app. It allows you to zoom into the gasket without limits, except for computer time. In this blog and on http://geometricolor.ch/home.html you find more information on kaleidoscopes.

Posted in Anamorphosis, Fractals, Kaleidoscopes, Tilings | Tagged , , , , , | Leave a comment

waves – a browser app for creating quasiperiodic wallpapers

I have made a browser app that lets you create quasiperiodic wallpapers. You find it at http://geometricolor.ch/waves.html . It uses a symmetric superposition of waves as proposed by Frank Farris and presented by Erica Klarreich in the Quantamagazin in “How to Make Impossible Wallpaper“. Christoph Pöppe is writing about this idea in a forthcoming article for the Spektrum der Wissenschaft. To make the app easy to use, I have only included a few of the possibilities presented in this blog. To make your own experiments and to modify the app you can use my Github repository https://github.com/PeterStampfli/images, in particular the current commit f260803. The code of other commits might be broken.

The app obtains the colour of a pixel of the symmetric image from its coordinates (x,y), which are transformed to new coordinates (X,Y). The app then takes the colour of an input image at the position (X,Y). Instead of using an input image, the app can directly show the structure of the waves by using the X-coordinate value for the green colour component and the Y-coordinate for the blue and red components of the pixel. For the transformations I used the most basic results from the general discussion of the post “Improved symmetric sum“. Note that the transformations are different for rotational symmetry of odd or even order.

For 5-fold rotational symmetry and rotational symmetry of higher odd order the app calculates the (X,Y) coordinates using


where m is an odd number, the order of the rotational symmetry. Only for m=3 we get periodic images.

Obviously, at the origin where (x,y)=(0,0) we get the transformed coordinates (X,Y)=(m,0). At the origin we have trivially a m-fold rotational symmetry. Going away from the origin the different waves first get out of sync, but sufficiently far away they get in phase again. This is similar to a Moiré pattern, see my earlier post “Quasiperiodic designs and moiré patterns“. Thus there are many points where X≈m and Y≈0. Around these points we get approximate m-fold rotational symmetry. They are distributed quasiperiodically. You can see this if you choose the 5-fold rotational symmetry in the app. This becomes more clear if you also switch on the additional tiling, which is the Penrose rhombus tiling for m=5. Note that the corners of the rhombs lie at points with approximate local 5-fold symmetry. Unfortunately, 7 and higher odd order rotational symmetries have more interfering waves and they get in phase again only at very long distances. Thus, the resulting images seem to be rather chaotic and it is nearly impossible to see their quasiperiodic structure. Thus I choose not to include them in the app.

For 8-fold and higher rotational symmetries of even order 2m, where m is an integer,  the app uses a similar equation for the transformed X-coordinate as for odd order:

Note that the cosine function is symmetric, cos(-x)=cos(x), which makes that we get a 2m-fold rotational symmetry from only m waves. But we cannot simply replace the cosine by a sine to get Y(x,y) because the sine function is antisymmetric, sin(-x)=-sin(x). This would destroy the symmetry. Instead, I choose the slightly more complicated equation

which too has 2m-fold rotational symmetry. Note that these waves are rotated with respect to the waves of X(x,y) by an angle of π/2m. The app uses these packages of symmetric waves to create quasiperiodic images of 8, 10 and 12-fold rotational symmetry. In all three cases you can see basic motives repeating with slight variations throughout the plane. There are many points with approximate local rotational symmetry. This becomes more clear if you choose to display the matching tilings. For 8-fold rotational symmetry the app displays a patch of the Ammann-Beenker tiling, for 10-fold rotational symmetry it shows only a rosette around the origin and for 12-fold rotational symmetry you see a tiling of rhombs, triangles and squares resulting from an iteration method presented earlier. Images with rotational symmetry of higher order again have a rather chaotic appearance and it is difficult to see that they are quasiperiodic. Thus they are not included in the app. However, you might want to do your own experiments with its code.

For rotational symmetries of even order 2m the app offers an additional two-color symmetry: Rotating (x,y) by an angle of π/m inverses the colours of the image. It uses the method presented in the post “Improved two-color symmetry upon rotation“. An additional function U(x,y) modifies the color. The output image pixel has the original colour of the input image if U is positive; and if U is negative then the colour is inverted. The equation for U is different for even or odd values of m as shown in “two-color rotational symmetry“. For odd m the app uses

and for even m

You can easily verify that rotating (x,y) by π/m inverts the sign of U. The transformation to (X,Y) uses the absolute value of U(x,y) for X(x,y) and the same form for Y(x,y) as for simple rotational symmetry without colour change.

You are welcome to do your own experiments with http://geometricolor.ch/waves.html. If you have any questions you can reach me at pestampf@gmail.com.

Posted in Quasiperiodic design, Tilings | Tagged , , , , | Leave a comment

Inversion in a single circle

You might think that discussing the inversion in a circle is somewhat underwhelming. But, as I am using multiple inversion in many circles to create fractal images, I found that there are some important ideas you will not find so easily. I will present them briefly here and use them in the next posts.

Inversion in a circle is nearly the same as a mirror image at a straight line. Actually, in a stereographic projection of a sphere and in the Poincaré disc representation of hyperbolic space, most geodesic lines are represented by circles, see my earlier post “Straight lines in elliptic and hyperbolic space“. A mirror image in these geodesic lines thus becomes an inversion in the corresponding circle. You can use this to create Kaleidoscopes for elliptic and hyperbolic space.

Any circle can be transformed to a straight line by an inversion in a suitably chosen second circle. The inversion in the first circle then becomes a mirror image at the straight line. This is useful to get a systematic overview of the images resulting from multiple inversions in several circles.

I will show you some illustrations of the above. But first I am briefly repeating some well-known details. For a circle with radius R and centre at position c, it is easy to calculate the inverted image q of a point p using

This is as easy to calculate as a mirror image at a straight line and it has similar properties. Points on the circle are fixed points. Points inside the circle are mapped to the outside and inversely. However, inversion maps the centre of the circle to infinity. We get an intuitive image of inversion in a circle if the circle is the stereographic projection of a great circle of the Riemann sphere. Then the inversion is simply a mirror image at the plane containing the great circle and exchanges the corresponding halves of the sphere.

I do not want to discuss more details – I’d rather prefer to show how inversion acts on an image. This is an example:

The inverting circle is shown as a blue line. The photo of a butterfly is directly mapped into its inside. The outside shows an inversion of the inside. It results from inverting the position of each pixel in the circle and looking up the colour at the inverted position. This image results from the browser app at http://geometricolor.ch/singleCircleApp.html. Use it to learn more about inversions in circles making your own experiments with other images. You can see we have indeed an approximate mirror symmetry close to the circle. Note the strong distortions far away from the circle.

In spite of the strong distortions the inversion in a circle is very much the same as a mirror image at a straight line. You can see this in the next image:

Here, the centre of the red circle lies on the blue circle. Thus an inversion in the red circle maps the blue circle into a straight line, which is the orange line. The inversion in the blue circle, as seen in the first image, now becomes a mirror image at the orange line. Here, you can see that details of the flower and the head of the butterfly are mirrored in the same way as in the previous image. You cannot see how one of the wings intersects the orange line and gets mirrored because the image is too small. Again, this is a result of http://geometricolor.ch/singleCircleApp.html and you can do your own experiments.

For the following posts, the inversion in a circle is both a building block for creating images and an isometry of non-Euclidean planes. It simplifies systematic searches similarly as scaling, rotation, translation and mirror symmetries.

Posted in Anamorphosis, Kaleidoscopes, programming, Tilings | Tagged , , | Leave a comment

Various projections of hyperbolic kaleidoscopic images

Similarly to the earlier post “Different projections of spherical kaleidoscopic images” I am now showing the same kaleidoscopic image using different projections you can use in my kaleidoscope browser app http://geometricolor.ch/sphericalKaleidoscopeApp.html. It primarily generates images as Poincaré discs. A typical result looks like this:

This is a decoration of a {5,4} hyperbolic tiling made of pentagons, four of them meeting at each corner; or you might see an equivalent tiling of squares, five meeting at each corner. Mirror lines are geodesic lines. Here they are circles that intersect the border of the disc at right angles. Be careful if you follow these lines across the centers of five-fold rotational symmetry.

The Poincaré disc is a particular projection of the hyperboloid model of hyperbolic space. Other projections give different related images. However, I have difficulties to work with the hyperboloid model and I prefer the hemisphere model for looking at different projections. The hemisphere model results from an inverse stereographic projection of the Poincaré disc to the upper hemisphere of a sphere with the same radius as the disc. The center of projection is the south pole of the sphere. The projected boundary of the Poincaré disc lies at the equator of the sphere. Obviously, we can then use all spherical projections available for a sphere. This allows for a lot of experiments.

An orthographic projection of the hemisphere gives the Beltrami-Klein disc. A gnomonic projection of the hyperboloid model gives the same result. The hyperbolic tiling then looks like this:

The orthographic projection magnifies the center of the image and squashes outer regions towards the border. This makes that we see a decorated sphere. Here the mirror lines are straight lines. Again, be careful not get confused by the centers of five-fold symmetry. I prefer this projection to the Poincaré disc because it is more dramatic.

A gnomonic projection of the hemisphere model or an orthographic projection of the hyperbolid model gives the Gans model. The tiling fills the entire plane:

It has strong distortions outside the center as expected for a gnomonic projection. The mirror lines are now hyperboles. This image makes me dizzy. It somehow looks like the inside of a vault.

Rotating the hemisphere such that its border is perpendicular to the xy-plane and then doing a stereographic projection we get the Poincaré plane. This is equal to doing a Cayley transform on the Poincaré disc and gives such an image:

As for the Poincaré disc, geodesics and mirror lines are circles that intersect the border at right angles. The become half-circles and have their centers at the border. This image is more impressive than the Poincaré disc because it is less uniform.

Posted in Anamorphosis, Kaleidoscopes, Tilings | Tagged , , , , , | Leave a comment

Double spirals

In the post “Spirals” I have shown how to transform periodic Euclidean tilings into logarithmic spirals. A typical result looks like that:

The spiral has a center at the origin and goes out forever. Actually, it spirals not only around the origin, but around infinity too. We can see this better if we look at the Riemann sphere. It is a stereographic projection of the entire plane on a sphere placed above the origin. The image of the origin lies at the south pole of the sphere and points infinitely far away all go to the north pole. On this sphere, the spiral goes out from the south pole and grows until it comes to the equator. Then it crosses to the upper hemisphere and shrinks, going towards the north pole. Thus the spiral has two centers, one at the south pole and one at the north pole.

To see both centers of the sphere on the plane we can use the Cayley transform. With complex coordinates it is simply f(z)=(z-i)/(z+i). It maps the point (0,1) to (0,0) and (0,-1) to infinity. Applying first this mapping to the points of the plane and then doing the transform to get a spiral we have images of a spiral that has two centers, one at (0,1) and the other at (0,-1). The spiral shown above now looks like that:

Close to the two centers we get copies of the original spiral. The two spirals are linked together by a distorted copy of the basic square tiling.

You can find more details in the book “Indra’s Pearls”, written by David Mumford, Caroline Series and David Wright.

Posted in Anamorphosis, Kaleidoscopes, Tilings | Leave a comment

Different projections of spherical kaleidoscopic images

As you are here, I suppose that you might be interested in the TilingBot living on twitter. Each day it posts the image of a new tiling. Have a look at https://twitter.com/TilingBot and become its follower. I have fun to recognize the symmetries of these tilings. It is surprising to see the effect of different projections. So I upgraded my app that generates kaleidoscopic images. It now offers different projections of a tiling and you can find it at http://geometricolor.ch/sphericalKaleidoscopeApp.html.

Today I present different projections of an image with elliptic geometry. It uses a kaleidoscope of three mirrors with corner angles that make four-, three- and two-fold rotational symmetries. As such it generates the symmetries of a octahedron or cube. An additional mirror cuts of the corners as discussed in my earlier post “Decorations of semi-regular tessellations” and results in a decoration of a cuboctahedron projected on a sphere.

The most common view is the orthographic projection. It simply shows one hemisphere as seen from far away. This is a typical result:

Orthographic projection

The mirrors of the kaleidoscope are planes that go through the center of the sphere. Thus, on the surface of the sphere they appear as great circles being mirror lines. In this projection the circles become ellipses, depending on the inclination of their planes. Great circles passing through the center become straight lines.

Going close to the sphere we get the stereographic projection. Imagine that the sphere is decorated with transparent color and that you have a source of light at its north pole. Then you look at the projected image on a tangent plane at the south pole. What you see is a stereographic projection of the sphere. The decoration shown above in orthographic projection now gives us this image:

Stereographic projection

Here, great circles appear as true circles that invert the image. Circles going through the center have an infinite radius and thus appear as straight lines. Looking at small regions, the mapping preserves shapes and changes only their size because it is conformal. For programming the kaleidoscope I am using this view, as you can see in my post “elliptic kaleidoscopes” and in my paper for the Bridges 2008 conference.

Putting the projecting light source at the center of the sphere, we get the gonomic projection. It only shows a hemisphere and looks like this:

Gonomic projection

The great circles now appear as straight lines because the projecting light is at their center. Look out for local mirror lines in this image to find the great circles. The strong distortions make a dramatic effect. Globe lamps might project similar images on the ceiling if the source of light is small enough.

Finally, projections on cylinders are interesting too, in particular the conformal Mercator map:

Mercator projection

This projection is conformal and preserves the shape of small regions similarly to the stereographic projection. But now we get a repeating image in the horizontal direction. The great circles appear as sinusoidal lines.

Obviously, there exist many other projections and I can’t do them all. Tell me if you are missing your favorite one.

Posted in Anamorphosis, Kaleidoscopes | Tagged , , , , | 1 Comment