Simple charts with Open Flash Charts


Open Flash Chart is Open Source project which helps developers to add beautiful charts to their web pages or applications. It is available under LGPL license. Open Flash Chart ( is a collection of Flash applets that you embed in your web page, and which fetch data from the web server to display.

New version (2) uses JSON data and ActionScript 3 for generating charts. As the name says, you just generate some JSON encoded data and with a touch of JavaScript you got yourself a great chart.

I will show you a simple example of using the script to create a small chart. We will use included PHP library (it also has Perl, Python, Ruby, .NET, Google Web Toolkit and JAVA libraries). So go to and download the code, unzip it somewhere.

Let us generate some dummy JSON data:


include 'php-ofc-library/open-flash-chart.php';

// generate some random data

$max = 20;
$tmp = array();
for( $i=0; $i<9; $i++ ) {
  $tmp&#91;&#93; = rand(0, $max);

$title = new title( date("D M d Y") );

$bar = new bar();
$bar->set_values( array(1,2,3,4,5,6,7,8,9) );

$chart = new open_flash_chart();
$chart->set_title( $title );
$chart->add_element( $bar );
echo $chart->toString();

Save this as data.php in same folder as you unzipped the script.

This PHP code will generate JSON data that looks something like this:

    "title":{"text":"Wed May 26 2010"}

Now the HTML and JavaScript part:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Simple charts with Open Flash Chart | Codeforest</title>
<link rel="stylesheet" type="text/css" href="my.css">
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
  "open-flash-chart.swf", "my_chart", "550", "200",
  "9.0.0", "expressInstall.swf",
<div id="container">
    <p>Hello World</p>
    <div id="my_chart"></div>

As you can see, we are embedding the chart using swfobject (it is also included) so IE will not bother us with messages. We are giving SWFobject some parameters like width and height and id of element in which the chart will be generated.

Save this file as index.php in the same folder where you unzipped the library.

The demo for this is available here

Pretty neat. The biggest advantage of Open Flash Chart is speed and ease of implementation.

You can see a more complex example here

About the author

Zvonko Biškup

A passionate web developer with more than 13 years experience in PHP and other web related technology. My main interest is WordPress and new PHP frameworks.
Owner of Influendo Programming.
Enjoys exploring new stuff and possibilities, using new technologies and just having fun developing awesome stuff.

By Zvonko Biškup