Plotting with JavaScript, Canvas & Interval Arithmetic

Posted on Wednesday September 2 2009

I decided to have some fun with the new features in Firefox 3.5 and reimplemented the function plotting from my (still unreleased) chart library using the HTML5 Canvas element and Web Workers. Charts are plotted using interval arithmetic. The basic idea behind this is to recursively subdivide the range in which to plot a function. It keeps subdividing the range until the subdivisions are smaller than one screen pixel. At that point it will plot a pixel on that location. This pixel is then guaranteed to contain the correct solution. This also means that plots are always correct, in that they have no missing singularities or artifacts that are difficult to plot using other methods (well, that's the theory anyway―the interval arithmetic implementation I wrote does not guarantee correctness.) Web workers are used to run some of the recursive subdivisions in separate "threads" for better performance.

Equations are parsed using a Shunting Yard parser and converted internally to interval arithmetic. Most common mathematical operators are supported, such as: sin, cos, sqrt, abs, fmod, exp, log, et cetera. The code is still very much alpha quality, but I thought it might be interesting to put it online. You can find it right here: http://www.bramstein.com/projects/interplot/plot.html.