Return of the SVG Grapher

[jkd]

I just rewrote my SVG grapher sans conics so that it doesn't suck.

Polar graphing is usable, and you can change the window settings around now. I also added support for parametric equations.

I haven't gotten around to adding conics back yet, but I promise they'll be back and better than ever.

Of course, you'll need an SVG enabled build of Mozilla to view this.

Windows users, you should get a GDI+ build (this is off the 1.3 trunk):
http://www.croczilla.com/svg/mozilla-svg-gdiplus-20021128.zip

Other OS's, you hunt around for a libart build at Mozilla.org.

Here is it:
http://www.jasonkarldavis.com/scripts/grapher/grapher.xml

For the underprivileged surfers who aren't using Mozilla (or don't have an SVG-enabled build), you can look at a screenshot here:

http://www.jasonkarldavis.com/grapher.png

Other than adding conics, I need to allow the user to redraw graphs on resize (zoom out after graphing to see why), selectively clear certain graphs, and probably implement a degrees mode.

A XUL Sidebar version is next on my list after these, followed by an IE port using the Adobe SVG Viewer. :)

What are your thoughts?

[chrismiceli]

it isn't working for me, i am using mozilla 1.01?

[jkd]

Like I said, you need an SVG-enabled build of Mozilla.

There are libart builds at Mozilla.org, but I recommend the GDI+ build from the Croczilla link I posted above.

[krycek]

it's excellent, as usual :D

glad you took my advice and rewrote it... when you have finished the sidebar version I can see myself using that :)

I think an IE port would be very kind! ;)

::] krycek [::

[brothercake]

Looks very cool man ... but I so don't understand the maths :eek:

Can you post some sample equations that yield funky-looking graphs :)

[jkd]

Graphing anything with Math.random() instantly looks very cool and provides a visual look at the pseudo-randomness of Javascript.

r = Math.random()*5

Nice jagged circle

f(x) = Math.random()*x

Nice line (triangles really). Graph on top of y = 0.5*x to see the supposed average value.


As for pretty curves, polar coordinates are really good at that.

r = t

is a spiral.

You can make flowers by

r = Math.sin(c*t)
and
r = Math.cos(c*t)

where c is some constant.

Etc etc

An interesting function kind of popular in Calc courses is
f(x) = Math.sin(1/x)
Because it oscillates infinitely between 0 and 1 as x approaches 0

Just a classic one:

f(x) = Math.sin(x)/x

which you can prove approaches 1 as x approaches zero by what is known as the sandwich theorem. :)

[jkd]

I know some people are still interested, but here is a sidebar version written in XUL:

http://www.jasonkarldavis.com/scripts/grapher/xul/grapher.xul

Even if you don't have an SVG-enabled build, you can still check out the tabbed interface...

There is currently a regression in window settings (they kinda work, but I don't know what exactly is going on), and hyperbola graphing isn't up to par yet. (I'm working on approximating hyperbolas by quadratic bezier curves...)

But the other 3 conic sections work a treat (and parabola graphing has been improved by converting it into a quadratic bezier curve instead of plugging and chugging line-to's).

There are still some problems with graphing functions that approach infinity very quickly as x approaches 0, but I think I have an idea to fix it (at cost of some accuracy for certain window settings - but then again you really can't accurately graph infinity, so...).

When this is finished, I intend to put it in an installable XPI instead of having the sidebar on the server (save some bandwith). Hopefully I can get hyperbolas worked out today, along with the window settings issues.

In the future I intend to add in support to select previously graphed functions, and remove them, as currently once they are grapher, they are permanent. You have to reset everything to remove it, which isn't always preferable.