Click here to go to the applet.

This javascript applet is a demonstration of the discrete fourier transform. You will see an example image on the left, which is actually a complex function of x and y. The fourier transform will be shown on the right.

The **Example popup** lets you select some other examples.

The **Mouse popup** determines what the mouse does which clicking and dragging on the function or its transform. For
example:

**Draw Rectangle**draws a solid rectangle. The transform of this function is a sinc function.**Draw Ellipse**draws a ellipse.**Draw Points**draws a point at the mouse position, which might be very hard to see unless you zoom in.**Draw Gaussian**draws a Gaussian function, which is centered where you first click the mouse. Drag the mouse to determine its width. The transform of a Gaussian is also a Gaussian.**Translate**moves the function. Since we're demonstrating the discrete transform, the function wraps around at the edges.**Scale**rescales the function.**Subdivide**rescales the function to be smaller, creating multiple copies.**Inspect**momentarily zeroes out the function everywhere except at the cursor position, so you can see the transform of just that part of the function.**Clear All But Rectangle**zeroes out the function everywhere except in a rectangle which you specify by clicking and dragging.**Clear All But Ellipse**zeroes out the function everywhere except in a ellipse which you specify by clicking and dragging.**Multiply By Gaussian**multiplies the function by a Gaussian which is centered where you first click the mouse. If done on the fourier transform, this performs a Gaussian blur on the source image.**sinc(x)*sinc(y)**draws a sinc function in two dimensions, centered where you first click the mouse. Drag the mouse to determine its width.**Multiply By sinc(x)*sinc(y)**multiplies the function by a sinc function. If done on the fourier transform, this does a convolution with a rectangle.

**Clear** will reset the function to zero.

**Multiply by -1** will multiply the function by -1, changing its phase. Since DFT is linear, this also
multiplies the transform by -1.

**Flip X/Y** will flip the function in the X or Y direction (reflect it over the Y or X axis).

**Zoom In On Transform** will zoom in on the fourier transform for closer inspection. You can also **Zoom Out**.
The mouse wheel does the same thing. You can't zoom in on the source function.

**Reset Example** resets any changes you have made to the example.

**Load Image** will let you choose an image to load. The image should be roughly square, or it will be stretched. Only the red channel
of the image is used.

**View Phase as Color** uses color to indicate the phase of the complex functions. If you turn this off, then only
the magnitude will be shown.

**Brightness** can be used to reduce or amplify the brightness of the functions.

**Draw "Color" (Magnitude)** can be used to specify the magnitude of the value used to draw on the function
when doing **Draw Rectangle**, etc. Set this to zero to erase. The actual value drawn is shown below.

**Draw "Color" (Phase)** can be used to specify the phase of the value used to draw.

Click here to go to the applet.