Fermat hypersurfaces

Here is an interactive visualization of Calabi-Yau manifolds as Fermat hypersurfaces.

The figure can be rotated by clicking and dragging with a mouse or swiping on a touch device, as well as zoomed in or out with a mouse wheel or pinching on a touch device. The integers on the buttons determine the degree of the underlying equation defining the surface.

The interactive graphic is a JavaScript implementation of the techniques described in this online reference, apart from the color coding:

The method of visualization boils down to three-dimensional projections of a surface in four dimensions defined by the equation

$z_1^n+z_2^n=1$

with two complex variables and an arbitrary integer n as exponent. This equation is identically solved by the coordinate combinations

$z_1=e^{i{\phi }_1}[cos(x+iy){]}^{2/n}{z}_2=e^{i{\phi }_2}[sin(x+iy){]}^{2/n}$

where the phase factors are nth roots of unity with

${\phi }_1=\frac{2\pi k_1}{n},0\le k_1<n{\phi }_2=\frac{2\pi k_2}{n},0\le k_2<n$

The nth powers of the phase factors are exponentials of multiples of 2πi , hence unity.

The real and imaginary parts of z₁ and z₂, a total of four variables, parametrize a surface in four dimensions. The surface presented above consists of the coordinate triples

$[Re{z}_1,Re{z}_2,Im{z}_{1}cosa+Im{z}_{2}sina]$

where the third coordinate is a linear superposition of the imaginary parts of the complex variables. This is an orthogonal projection in which the fourth coordinate, the linearly independent combination

$Im{z}_{1}sina-Im{z}_{2}cosa$

is simply ignored. The same process produces two-dimensional shadows from three-dimensional objects when the sun is directly overhead.

Since JavaScript does not support complex numbers natively, numerical evaluations are performed with Math, a library providing special functions in the browser. While it is possible to convert the complex expressions to pure real ones by hand, the expressions are somewhat cumbersome. A library that handles complex math is by far more convenient.

The color coding in this graphic is chosen to provide maximum distinction around points of symmetry where patches meet. Since CSS hue values run from zero to 360, the hue of each patch is determined by

$360\times \frac{k_1+k_2}{n}mod360$

One peculiarity of the coding for the surface is noteworthy: the number of steps in the y-variable must be even to avoid holes in the surface around y = 0 . This is because the description used in MathCell of a parametric surface in terms of slices and stacks always has one more vertex in each direction than these two numbers, so that keeping the number of steps even ensures that the origin of the y-variable is included. For both parametrization variables small numbers of steps are used to reduce browser load and defects from z-fighting.

With color coding enabled, there is still some noticeable z-fighting among portions of the surface close to one another. There does not appear to be a simple way to avoid this without introducing artificial distortions into the surface, but that would be less desirable than the z-fighting distraction.

One simple extension fixes projection angles and renders the graphic as a wireframe:

<= Pre page

Reference