Lateral Angular Velocity: 0.2

Longitudinal Angular Velocity: 0.2

The Hopf fibration is an interesting continuous map from the unit 3-sphere (unit quaternions) to the unit 2-sphere (ordinary sphere in space). The interesting thing about this map is that the pre-image of any point on the 2-sphere is exactly a circle on the 3-sphere. This map has a special property which makes it a *fibration*, and the circles which are the pre-image of a given point are called the *fibers* of that point. To construct the map, we represent a point in 4D space as a pair of complex numbers, $(z_1,\; z_2)$, and a point in 3D space as a complex number paired with a real number, $(z_0,\; x)$. The map is as follows:
$$(z_1,\; z_2) \mapsto (2z_1\bar{z_2},\;|z_1|^2-|z_2|^2)$$
Where I've used $\bar{z_2}$ to represent the complex conjugate of $z_2$. It's not difficult to see that multiplying $z_1$ and $z_2$ by the same complex number of absolute value 1 (the same action as rotating them both in the complex plane by some angle) gives the same result under the Hopf map. This tells us that the pre-image of any point is *at least* a circle on the 3-sphere. To see why it is exactly a circle let $z_1=w+xi$ and $z_2=y+zi$. The Hopf fibration is then:
$$(w,\; x,\; y,\; z) \mapsto (2(wy+xz),\; 2(xy-wz),\; 1-2(y^2+z^2))$$
The last component may be a bit confusing, but remember that we are on the unit 3-sphere, so $w^2+x^2+y^2+z^2=1$ and therefore $w^2+x^2-y^2-z^2=1-2(y^2+z^2)$.
Now, if we look at the matrix representation of the rotation induced by some unit quaternion $q=w+xi+yj+zk$:
$$
\begin{bmatrix}
1-2(y^2+z^2) & 2(xy + wz) & 2(xz-wy)\\
2(xy - wz) & 1-2(x^2+z^2) & 2(yz+wx)\\
2(xz+wy) & 2(yz-wx) & 1-2(x^2+y^2)
\end{bmatrix}
$$
The first column looks exactly like the Hopf map! This means that the pre-image of $p$ on the unit 2-sphere is the set of all quaternions which rotate $\langle 1,\; 0,\; 0 \rangle$ to $p$!

We can construct a quaternion that rotates $\langle 1,\; 0,\; 0 \rangle$ to $p$ as long as $p$ is not $\langle -1,\; 0,\; 0 \rangle$. We will call this quaternion $q_p$.
$$q_p=\frac{1}{\sqrt{2(1+p_y)}}(1+p_y+p_zi-p_xk)$$
Pre-composing this rotation with any rotation about the x-axis will also rotate $\langle 1,\; 0,\; 0 \rangle$ to $p$. A quaternion which rotates about the x-axis by $\theta$ is given by $q_{\theta}=\cos(\frac{\theta}{2})+\sin(\frac{\theta}{2})i$. If we let $\theta$ vary from $0$ to $4\pi$, $q_\theta$ is a great circle in the set of unit quaternions. The composition of these rotations is simply the product of the quaternions: $q_pq_{\theta}$. This parametrizes the circle on the unit 3-sphere which is exactly the pre-image of $p$.

There's a rather long expression for this product in terms of $p$ and $\theta$, but instead of looking at that I'm going to get into how I actually rendered these fibers (or pre-images). First of all, there are 16 points on the equator of the 2-sphere whose fibers are being rendered. As you can probably guess, the 2-sphere isn't standing still. It's being rotated and the sliders that you can adjust correspond to the lateral and longitudinal velocities of the unseen 2-sphere. The rgb components of the color of a fiber corresponds to the xyz coordinates of its point scaled down by $\frac{1}{2}$ and shifted up by $\frac{1}{2}$ to get it into the range $[0,\;1]$.

For each point on the 2-sphere being sampled, I used the expression for $q_pq_{\theta}$ to calculate 3 points on the fiber of $p$ by plugging in 3 (arbitrary but different) values for $\theta$. I then stereographically project these 3 points into 3D space and calculate their orthocenter and the radius of the circle that they define, this is also enough information to compute a direction vector for the circle and a matrix that rotates the y-axis to that direction. All of this information, color, center, and rotation matrix, is sent to the shader. The shader uses this and the signed distance field for a torus of constant thickness to raymarch each fiber.

To conclude this little tidbit on the Hopf fibration, I want to mention a fact whose proof I haven't looked into, but that I find extremely fascinating. If you imagine the tori in the image above as circles, and instead you imagine infinitely many, filling all of 3D space, they are the flow-lines for a fluid satisfying the incompressible Navier-Stokes equations! Source. This personally makes me want to start learning about fluid dynamics!