Scroll down for instructions...
This applet helps you visualize a number of mathematical constructions.
They are explained one by one below. They are each constructed from a set
of points in the plane. Initially, the drawing plane is empty.
There are 12 different mathematical constructions that you can switch on
and off as you wish. Initially, they will be drawn in blue, but you can
change that using their colour control panels. The constructions are
explained one by one below.
You will see a set of checkboxes at the top of the applet. Initially, the
checkbox labeled "Add" is selected. This means you can Add points to the
plane by clicking on the screen. Try it!
If you click on the "Remove" checkbox, you will be able to delete the points
you created. Each time you click on the screen, the point nearest to your
mouse cursor will be deleted. Try it!
If you click on the "Move" checkbox, you will be able to move the points around.
Each time you click on the screen, the point nearest your mouse cursor will
be moved instantly to the place where you clicked. What's more, if you hold
down your mouse button, and move the mouse around, the point will follow
your mouse cursor like a magnet. Try it! Or, if you deleted all the points
before, Add some more points first, then try it.
The points initially look like red blobs. This is because of the green check
mark next to the word "blobs". If you click on the green check mark, it will
turn grey and all the blobs will disappear! Don't worry :- the points are still
there, but you can't see them. You have switched blobs "off". If you now
click on the grey check mark next to "circles", the points will re-appear,
but drawn as red circles.
You can also draw the points as dots (a single very small dot for each point),
or as + signs, or X's. You can even choose several at once, for example,
making a star from a + and a X.
You can change the colours of the blobs or circles, or of any of the
mathematical constructions, using the colour control panels. Each item has
its own colour control panel. The panel shows 10 colours you can choose from,
as well as two buttons that allow you to make the panel brighter or darker.
Therefore, you have a choice of 30 colours for each item displayed on the
To help you place the points more carefully, or just for fun, you can also
draw a grid, or a pair of axes, or both on the screen, by clicking the check
marks next to the words "grid" or "axes", until the check mark is green.
The axes are black, and the grid will be light grey, but you can change that
using the colour control panel.
You can also change the background colour of the plane. Black is nice, but
you'll need to change the colour of the axes as well. Then again, perhaps
you have some other favourite colour. If you click on the check mark near
the word "background", it stays green, of course. You can't switch off
Finally, just for fun, if you click on the Animate checkbox, the points will slowly
crawl around the screen, as if tugged and pulled by a mysterious force...
- Voronoi: This option draws the
calculated from the set of points. The Voronoi diagram, also called the
Thiessen diagram, is a set of polygons, each one containing exactly one of
the given points, and all other points in the plane which are closer to that
point than to any of the other given points. It is also known as the
Thiessen diagram or the Dirichlet Tessellation.
- Delauney: This option draws the Delauney
Triangulation of the points.
If you draw the Convex Hull (see below) of the points, there are many ways
to divide the convex hull into triangles, that is, to triangulate it.
The Delauney triangulation is the triangulation with the smallest total edge
length. It is related to the Voronoi diagram by duality, that is,
the vertices, edges and faces of the one correspond
exactly to the faces, edges and vertices (in that order) of the other.
- Hull: This option draws the Convex Hull of the points. Imagine
if the points were nails hammered into a board of wood, and you stretched
an elastic band around the outermost nails. What you would see would be
the convex hull. The convex hull is the smallest possible convex
polygon containing the points. Source Code Available
- Bezier: This option draws a set of Cubic Bezier Curves.
It works best when there are 4 points on the screen, but it tries to
draw sensible drawings when there are different numbers of curves.
The cubic Bezier curve is defined by 2 endpoints P0, P3, and two control
points P1 and P2. It starts from P0, leaving in the direction of P1, and
eventually arrives at P3, approaching from the direction of P2 (although
in general it does not touch the control points).
- Lines: This option draws a set of lines between the points.
It is principally useful to help illustrate the Bezier curves.
- Spline: This option draws the cubic spline interpolation
of the set of points. This cubic spline curve is made up of a number of
cubic polynomials, chosen so that the curve passes through the points,
and has continuous first and second derivatives. This implementation also
makes the slope equal to zero at the endpoints.
- Lin Int: This option draws a piecewise linear function passing
through the points.
- Poly Int: This option draws the
interpolating polynomial, that is, the
smallest degree polynomial
passing through the points. So if there are two points, it draws a line,
if three, it draws a parabola, and so on.
- L.Sq Line: This option draws the
line of best fit, or the least squares
regression line. If y is related by a linear function to x, and the points
are obtained by trying to measure y for various values of x, the least squares
line gives the best approximation to the true relationship between x and y.
- L.Sq. Quad: This option draws the least squares quadratic. It is
very similar in concept to the least squares line, except that it assumes that
y is related to x according to a quadratic equation.
- L.Sq. Cubic: This option draws the least squares cubic polynomial.
It is very similar in concept to the least squares line and least squares quadratic.
- L.Sq. Quartic: This option draws the least squares quartic. Need I say
- Draw the Voronoi and Delauney diagrams together. See how they change
together as you move the points around.
- Draw the Bezier and Lines together. See how they change as you move
the points around. Can you make a bezier curve with a loop? With a corner?
- Use the grid to line up some points in a straight line. Turn on
Polynomial Interpolation. See what happens as the number of points increases
beyond 15 or 20 or so. Compare this with the spline interpolation.
- Place some points scattered around a straight line. Turn on
the Least Squares Line. Add one more point, far away from the line.
See what happens to the line as you move that point around.
There exist books devoted entirely to many of the mathematical constructs given in this
applet, as well as excellent books on coding the methods into common programming languages. You may like to explore some of the titles below.
I recommend especially the first one.
Warnings and Tips:
- This applet places no upper limit on the number of points that you can
add. However, some of the mathematical constructions are very CPU-intensive,
especially if you move points around, so that the drawing must be
recalculated several times per second. If it seems a bit slow,
try removing some points, or some constructions. Or buy a faster computer :-)
- If you want to use an image produced by this applet, why not do a "screen capture"?
- Under Windows 95, pressing the "Print Screen" button will copy the screen onto the clipboard. ALT-Print Screen will copy just the active window.
Then, open Microsoft Paint, and press CTRL-V. This will paste an image of the screen, which you can then edit. You should be able to select any portion you want of the image, and then use
"Copy To.." to save the portion as a separate image.
- Under many flavours of Linux, pressing "Print Screen" will open up a dialog prompting
you to save the captured screen image to a file.
- Would anyone like to provide instructions for doing a "screen capture" under other systems?
All rights are reserved. Do not copy the Applet or load it in other webpages
before asking permission. If you wish to use the Applet for teaching purposes,
and you cannot use this online version, please email me with information about
how you intend to use it, and for how long, then wait for my reply. Thank you. The Applet is
intended for the general benefit of humankind. The Applet itself can display a brief copyright notice, and knows which web page it was loaded from.