Biolizard89 Graphula MAxEd βeta 1 (Formerly Coordinate Plane Generator)

Introduction

Welcome to Graphula MAxEd (Multiple Axes Edition), formerly known as Coordinate Plane Generator, by Biolizard89! Graphula MAxEd is a PHP-based function graphing program that outputs SVG, with some cool features. The main nice feature in Graphula MAxEd (as you can probably guess by my calling it "Multiple Axes Edition") is that it can handle more than 2 (or even 3) axes. That's right, in addition to standard 2D functions, you can now graph 3D functions.

Graphula MAxEd started out as a small project to avoid the hassle of drawing a coordinate plane by hand for every graphing assignment in my Trigonometry class. It grew, and grew, and grew, gaining new features like function graphing, and now multiple axes!

Graphula MAxEd is still being worked on, so there are still some missing features. Some features that were present in Coordinate Plane Generator (the 2D predecessor of Graphula MAxEd), like parametric and polar graphs, are not supported yet. Please be patient while waiting for me to add new features; I work on it in my free time, and I'm not getting paid for it.

Well, enough of my rambling; start using it, and have fun graphing!

Updates

Graphula MAxEd βeta 1

After over a year of on-and-off work, Graphula MAxEd (Multiple Axes Edition) βeta 1 is finally here! As you can probably guess by what the name stands for, it's no longer restricted to just planes; you can now graph with as many axes as you want! Nearly everything is being rewritten to accomodate this, and while it's not even close to complete, it's usable in its present state, so why not release it?

2.6

The r(theta) grapher has now been rewritten to only plot defined points.

2.5

The parametric grapher has been rewritten to only plot points that are defined.

2.4

Rewrote the y(x) and x(y) graphers so that functions which are undefined at certain values don't screw up the graph. Now it will only plot points that are defined. Parametric and r(theta) functions will soon be rewritten with the new code as well.

2.3

Added r(theta) polar function graphing.

2.2

The sizes of the grid markers and their distance from the axes are now dynamically generated based on the grid line separation. This should fix all the problems with extreme scales.

2.1

Fixed problems with the axes and their labels in extreme scales. The grid markers still aren't fixed yet.

2.0

W00t! I've hit 2.0! This release replaces the <line>s in the functions with <path>s; this fixes the problems with small gaps in the function graphs when the graph changes direction. It also shortened a 57.1KB test graph down to 19.5KB.

1.9

Styling of all elements is now supported.

1.8

Parametric function graphing is now supported.

1.7

x(y) function graphing is now supported.

1.6

Function graphing! Knock yourselves out! Only y(x) functions are currently supported.

1.5

I decided to take up the project again and be more organized this time around. This release adds the ability to change the pixel size of the final image. Yes, I know SVG makes this unnecessary, but since some SVG plugins don't make zooming very intuitive, why not?

1.1-1.4

Fixed problems including transform bugs, positioning bugs, and axis bugs. I don't have details as I was rather unorganized during this period.

1.0

Initial release; still very buggy.

FAQ

Who's the author?

This was written by me, Biolizard89.

What's a coordinate plane?

I could go into tons of detail, but basically, it's an object used in math that looks like graph paper, except that every line has a number, so every point has two numbers associated with it, the horizontal and vertical coordinates. I used to draw them by hand for class assignments, and it was very time-consuming. That's why I wrote this to make them for me.

So what is this, some kind of line-grapher?

Nope, it can't graph lines. All it does is generate a coordinate plane, and then optionally put SVG objects onto it. SVG 2.0 will support mathematical functions as <path>s; once it's released, you'll be able to use them. UPDATE: As of version 1.6, function graphing is supported!

How'd you make this?

It was written in SVG 1.1 and PHP, with Microsoft Notepad and Altova XMLSpy.

It asks me to download something! What gives?

You probably don't have a browser that supports SVG. Download a plugin.

I have an SVG plugin, and it still asks me to download. I'm using Mozilla. What's wrong?

Type about:plugins into your Address Bar. If it doesn't show the SVG plugin, make sure you've installed the Adobe SVG Plugin 6.0 Preview, and search your computer for "NPSVG6.dll". Copy that file into your Mozilla Plugins directory. Restart your browser, and it should work.

I'm using Firefox 1.5, and it looks funky.

Firefox 1.5's implementation of SVG is still very incomplete, and because of this, many SVG files generated by Graphula MAxEd will look weird. An example is that the axis labels may be missing. Luckily, there's a simple fix. Just install Adobe SVG Plugin 6.0 Preview (instructions are in the previous Q/A), and then disable Firefox's native SVG support by typing "about:config" in your Location Bar, and setting the pref "svg.enabled" to false by double-clicking it. You'll have to restart Firefox for it to work.

Why are the axes and text scaled funny?

Because SVG 1.1 doesn't allow stuff to use the viewport coordinate system, only the user coordinate system. Since the user coordinate system is scaled so that the coordinates are by graph units, not pixels, that means that sometimes the axes and text will be scaled so that they look weird. This will be fixed by SVG 1.2. UPDATE: As of version 2.2, most, if not all, of the scaling problems should be fixed.

How do you graph functions?

First of all, they need to start "y(x)=", "x(y)=", "x(t)=", "y(t)=", or "r(theta)=" (depending on the type of function), even if your axes are not named y and x. x(t)= and y(t)= functions must come in pairs, with the x(t)= function first. Each function must be on a separate line. You also need to be sure to not omit the "*", in other words, no invisble multiply operators. Math functions supported by PHP will work fine. So, for example, you might enter "y(x)=3*sin(x)".

This has changed dramatically in Graphula MAxEd. Take a look at the new context-sensitive help for info on this.

My functions look ugly!

Decrease the Function Graph Increment value. This will make it plot more points, which will make curves look better.

Why is the file size so big?

The size of the function graphs section of the code varies inversely with the Function Graph Increment value. If the file size is too big, see if you can increase the Function Graph Increment value without hurting the quality too much.

Multiple Axes Edition, eh? Does that mean I can do more than 3 dimensions?

In theory. I say "in theory" because there are practical limitations on it. First of all, because Graphula MAxEd currently doesn't make depth perceivable, that makes anything with more than 3 dimensions difficult to understand. It is also made difficult to understand by the fact that objects with more than 3 dimensions are usually rendered in motion, which, again, is not currently supported by Graphula MAxEd. Finally, the time taken to graph a function grows exponentially each time you add an independent variable. With 3 or more independent variables (which most graphs that involve more than 3 dimensions entail), calculations may take so long that they exceed the 60-second execution limit imposed by PHP. But other than that, yes, it's possible.

Will you make this open source?

No. I worked very hard on Graphula MAxEd, and I don't want anyone else using my work for their own programs. Sorry.

I found a bug!

No kidding, really? </sarcasm> I know there are loads of bugs and incomplete features. I wasn't planning to release this beta originally, but it ended up being released because I wanted to have the work that's already done on my resume (so you're lucky to be playing with it at all!). If you find a bug, feel free to report it, but there's a good chance I already know about it. And don't expect a quick fix for any bug reports.

Example graphs, please!

Okay! Sphere, radius 4, centered at origin. Egg-shaped thingy (two semiellipsoids). Right circular cone. 3D sinusoid (hilly surface).

Wishlist

This is a list of features I'd like to add if I get bored. Don't expect to see all of them — heck, any of them — anytime soon.

Use It!

Image Dimensions (help)

This sets the dimensions (in pixels) of the generated SVG image. (hide help)



2D Mapped Coordinate System (help)

This specifies the 2D coordinate system that the space coordinate system is mapped to. If you have two axes, one of which is at 0 radians, and the other being at 0.5pi radians (the standard 2D settings), this coordinate system will be identical to the coordinate system that your functions are graphed in. If you have more than two axes, this will still determine where the origin is, and where the axis orientations map to. Inserted SVG objects will also be in this 2D coordinate system. (hide help)





Positive = Left
Positive = Right
Positive = Up
Positive = Down

Axis Settings (help)

This specifies the names of axes, their orientations (in radians, starting at the positive horizontal 2D mapped axis, and in the direction of the positive vertical 2D mapped axis), and the range of values that they are tested for when they are independent variables. Axes are separated by newlines, and properties of each axis are separated by commas (no spaces). (hide help)


Grid Line Settings(help)

If you want grid lines to appear on your graph, this allows you to specify them. You must specify what plane they are in (name the two axes), and the distance (in graph units, not pixels) between them for both axes. You can have more than one set of grid lines; separate them with newlines. For example, to have grid lines for the x-y plane, with an x separation of 1 and a y separation of 0.5, enter "x,y,1,0.5" (hide help)






Functions (help)

This is where you list the functions that you would like to be graphed. Right now, only cartesian functions are supported (no parametric or polar functions). A function is specified in this format: the name of the dependent variable, followed by an opening parenthesis, followed by a list (comma-separated) of the independent variables, followed by a closing parenthesis, followed by an equals sign, followed by the definition of the function (in terms of the independent variables). Functions are separated by newlines. For example, you might enter "y(x,z)=sin(x)+sin(z)" (this graphs a 3D sinusoid [hilly surface]). (hide help)


Graphing Style (help)

This lets you change how your graphs look. Parallel 1D Lines graphs using a large amount of lines that start at one end of the graph and trace the function to the other end. They do not crisscross. 2D Wireframe creates (three guesses) a wireframe. And 2D Fillled Surface looks like a wireframe but uses polygons instead of lines, so you can fill the surface with a color. Don't use 2D Wireframe or 2D Filled Surface if you're using functions with 1 input variable.(hide help)

Parallel 1D Lines
2D Wireframe
2D Filled Surface

Graphing Settings (help)

Right now, all that does anything is Function Graph Cartesian Increment. This specifies the distance (in graph units, not pixels) between consesutive points that are graphed while graphing functions. All points will be connected with lines. A lower value will make the graph more accurate, but will take longer to process and will result in larger files. A higher value will make the graph less accurate, but will be processed more rapidly and will reduce the size of your files. In my use, I find 0.01 to be good in 2D graphs, and 0.1 good in 3D graphs. (hide help)










Other Objects (help)

This lets you add 2D objects to the graph, specified in SVG. The coordinate system used is the 2D mapped coordinate system (units are graph units, not pixels). This means that if your axes' orientations are not the default 2D settings, the positioning may be a bit counterintuitive. It might help to temporarily add two axes with the default 2D settings while you're entering the Other Objects, and then remove them once you have them positioned properly. Or just do trial-and-error. (hide help)


Styling (help)

This lets you control the CSS styling that is applied to the graph objects. You can control the styling of the axes, the grid lines, and the functions. (hide help)


Graphula MAxEd is © 2004-2007 Jeremy F. Rand (AKA Biolizard89), and may not be used without giving me proper credit. Any commercial use of Graphula MAxEd requires written permission; e-mail me at graphula DOT 20 DOT biolizard89 AT spamgourmet DOT com.