HTML5 Fourier

Direct fourier transforms as models in HTML5.

June 12, 2011

Fourier purposed that no matter how complicated a periodic wave is, it is essentially the sum of many simple waves:

f(x)=a(0) + ∑ a(n)*cosine(nωx) +b(n)*sine(nωx)

In order to calculate the Fourier transform some basic trigonometric functions must be understood and used, The HTML5 canvas at right shows these basic functions in a dynamic graphical form. Written in javascript, these mathematical functions are the basis for calculations in fourier analysis.

Monument Valley

One of my favorite places is Monument Valley in North East Utah. It is majestic and solitary and a witness to the earths geological history.

The valley lies within the Utah Navajo Nation Reservation, some 180 miles from the Grand Canyon.

To make a mathematical representation of the mountains there must be a basic model so that the parameters can be manipulated using javascript and the HTML5 2d canvas..

Computing the Fourier transform of the values derived from the model result in the equation coefficients. From these we can compute the power spectra which tells us the contribution of each frequency component. To draw mountains of various sizes and shapes and locations, we only need to select a band range and compute the inverse transform.