Mission Technologies

Print this page

Read an Article

• Graph plotting on the web
  Posted by Ian on 26/08/08

  I needed a PHP page that would select some data from a whole bunch of files, and then plot it online.  Although there are many possible ways of doing this, all of them are really clunky and difficult.

  So then I  looked around and found a really excellent tool: Open Flash Chart (OFC).  This is open source (free) software.  You just download a few libraries, drop them into the root directory of your webserver - any webserver as far as I can see - then edit some of the examples to produce really amazing graphics.

  Check out this one here. 

  It uses a prebuilt flash executable that simple plays back the graph image. You get to write the graph by making a data file in a JSON format (a standard format). Even better to know is that the author of this OFC gives you the tools to make a JSON file.

   I won't spend time here by writing examples, because you can find extensive and useful tutorials on the OFC webpages.  What I will do though is give you some hints and tips:

  1. Go for OFC2.  It's still in late alpha, but is probably more consistent than OFC and will be developed for longer.

  2. If you plot a scatter plot (because you don't have sequential points along the x-axis) then you will find that there is a problem with the x lables. To get around this, create the graph as normal, and then use specific commands to set the x-axis attributes:

  For example, this is from one of the code snippets on the OFC website.  You have already, somewhere, created an x-axis called $x, and now you create a x-labels object:

   $x_labels = new x_axis_labels();


  Then you apply attributes as required: 

  $x_labels->set_vertical();
$x_labels->set_size( 16 );
$x_labels->set_labels(array( 'a','b','c','d','e'));


  Then you apply these x-labels with their attributes into the already existing x-axis:

  $x->set_labels( $x_labels );

  Finally you create the chart as normal (i.e. as in all the examples).

  3. You can't (as far as I can see) change the colour and the size of the labels on the y-axis (unless you add a y-axis to the right hand side of the graph), so just keep the x-axis ones as black 10 point text!

  OK, enjoy.  Now you can have great-looking graphs on your website, thanks to the developes of OFC.