Open Flash Charts 2 & individual clickable bars: How to add Links to bar charts



Open Flash Charts is an open source, flash charting component built by monk.e.boy. It supports multiple languages including php, java, .NET and more. In the words of the creator, it was created because
"I could learn Flash and Actionscript and write my own charting component, release it as Open Source, host it on sourceforge and build up a community of helpful coders faster than they(company who sells proprietary flash charting component) can fix a single bug.
--From http://teethgrinder.co.uk/open-flash-chart/ "


Open Flash Chart released version 2 Lug Wyrm Charmer in July 2009, and sadly the project hasn't seen a newer version since then. The community however has modifications and patches for OFC2 which keeps the project alive.

I used OFC2 in a intranet project recently where I didn't want to use Google Charts. Tutorials on the OFC2 website made the setup pretty easy.

I used Bar Charts, which did not properly support click events. The fix was pretty easy and I am documenting the same here.

Sample code for Open Flash Charts 2 on how to add links to your bar charts.
Usage Example:
stats.php (source from OFC examples, modified code is marked.)

set_colour( '#ff0000' );
$data[4]->set_tooltip( 'Hello
#val#' );

//modified code starts
$data[4]->set_on_click("http://google.com");
//modified code ends

$bar = new bar_glass();
$bar->set_values( $data );

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

echo $chart->toString();

Source Code Modification:
I was using the php-ofc-library, and had to modify the file ofc_bar_glass.
Find the class bar_value, and modify as below

class bar_value
{
/**
* @param $top as integer. The Y value of the top of the bar
* @param OPTIONAL $bottom as integer. The Y value of the bottom of the bar, defaults to Y min.
*/
function bar_value( $top, $bottom=null )
{
$this->top = $top;

if( isset( $bottom ) )
$this->bottom = $bottom;
}

function set_colour( $colour )
{
$this->colour = $colour;
}

function set_tooltip( $tip )
{
$this->tip = $tip;
}
//modified code start
function set_on_click( $onclick )
{
$tmp='on-click';
$this->$tmp = $onclick;
}
//modified code end
}

(Syntax Highlighting not available)
If you are new to OFC, you may have to look at the tutorials.

OFC2dz.com has a modified version of OFC, with a lightweight SWF file which I found very useful.

Comments