Interactive Gallery of Quadric Surfaces

Hyperboloid

Quadric surfaces are important objects in Multivariable Calculus and Vector Analysis classes. We like them because they are natural 3D-extensions of the so-called conics (ellipses, parabolas, and hyperbolas), and they provide fairly nice surfaces to use as examples for the rest of your class.

The basic quadric surfaces are described by the following five equations, where \(A\), \(B\), and \(C\) are constants.

\(\displaystyle z = A x^2 + B y^2\)
\(\displaystyle z^2 = A x^2+ B y^2\)
\(\displaystyle \frac{x^2}{A^2}+\frac{y^2}{B^2} + \frac{z^2}{C^2} = 1 \)
\(\displaystyle \frac{x^2}{A^2}+\frac{y^2}{B^2} - \frac{z^2}{C^2} = 1 \)
\(\displaystyle -\frac{x^2}{A^2}-\frac{y^2}{B^2} + \frac{z^2}{C^2} = 1\)

Rather than memorize the equations, you should learn how to examine cross sections to figure out what surface a given equation represents, as I will describe below.

Using This Gallery

In this gallery you’ll find interactive pictures of the quadric surfaces. You can see what the cross sections look like, and also see how various coefficients can affect how they look. The first picture below shows a sphere with an adjustable radius; click and drag the blue slider to change it. You can rotate the sphere by grabbing and dragging. You can also zoom in or out using the scroll wheel on your mouse or the equivalent touch motion.

radius = 2.3
Gridlines:
Surface:

There are additional controls at the bottom of the picture that determine how the surface is shown: you can change the material the sphere is made out of and also show or hide the gridlines. If you get lost when moving around, the “Reset view” button will take you back to where you started.

The next picture shows you various cross sections of the sphere, that is, the intersection of the sphere with a plane parallel to one of the coordinate planes. The picture initially shows the intersection of the sphere of radius 2 with the three planes \(x = 1 \), \(y = 1.4\), and \(z = -1.2\). Click and drag the blue sliders to adjust which plane is being used to “slice” the sphere to produce the cross section; while you are holding the slider, the plane in question appears. As with the previous picture, you can (and should!) rotate and zoom to get a better view.

x = 1.0
y = 1.0
z = 1.0

A Note about Domains

Sometimes a computer can graph a surface in more than one way. Look at the two pictures below; they both show graphs of the function \(z = x^2+y^2\). The first one is probably more familiar, and it’s what most of us would draw by hand. The second picture can be useful, though, because the gridlines on the surface show you the cross sections \(x=c\) and \(y=d\) of the surface.

Paraboloid Paraboloid

In technical terms, the two pictures show graphs of the same function but with different domains. On the left the domain is a disk, described by $$ 0 \leq x^2 + y^2 \leq 2 $$ On the right, the domain is a square, $$ \begin{align} -1 \leq x \leq 1 \\ -1 \leq y \leq 1 \end{align} $$

In this gallery I’ve drawn a lot of surfaces with square domains to emphasize the vertical cross sections. I’ve also included buttons below certain pictures which let you change the domain to a disk. You might be surprised how different some of the pictures will look when you change the domain.

In fact, that leads to a good way to gauge how well you understand the quadric surfaces. On each page you’ll be able to adjust the coefficients of the equation. Do this with both domains, and see if you can tell that it affects both graphs in the same way.

Now you’re ready to look at the gallery images. Use the menu at the top this page to choose which quadric surface you’d like to see!

Technical and Legal Details

This gallery was written by Jonathan Rogness and first appeared in the 2005 volume of the Journal of Online Mathematics.

In 2016, Nathan Dunfield redid the interactive 3D graphics from scratch using three.js instead of LiveGraphics3D so they work on web browsers that lack Java (which by 2016 was most of them). Dunfield also updated the styling to better support phones and smaller tablets, and switched to MathJax for displaying the formulas.

This material is Copyright 2004-present by Jonathan Rogness and Nathan Dunfield, and is licensed under the Creative Commons Attribution-NonCommercial-ShareAlike License. You can get the full text and code at its GitHub repository.