Any doubt?
In this tutorial I will explain how to remove the need for a seperate data file.
This is for advanced users only. I wrote Open Flash Chart and
even I don't use this advanced method. So...
only use this after you have a working chart!
The advantage of the data file is it is so easy to debug. Using Javascript and Open Flash Chart is
very hard to debug.
Right, on with the tutorial!
Removing the data file means one less request to your server. It also helps if you are
using model-controller-view framework. This is what we will build:
Note:
- The render methos takes a string 'js', this renders the chart as Javascript.
- Because we are not using open_flash_chart_object.php we need to pass in the width and height of the flash movie.
Create the flash object
<?php
include_once( 'ofc-library/open-flash-chart.php' );
$bar = new bar_sketch( 50, 6, '#99FF00', '#7030A0' );
$bar->key( '% Complete', 10 );
$data = array();
$labels = array();
$bar->data[] = 50;
$labels[] = 'Mon';
$bar->data[] = 65;
$labels[] = 'Tue';
$bar->data[] = 70;
$labels[] = 'Wed';
$bar->data[] = 75;
$labels[] = 'Thu';
$bar->data[] = 80;
$labels[] = 'Fri';
$bar->data[] = 89;
$labels[] = 'Sat';
$bar->data[] = 100;
$labels[] = 'Sun';
//
// ----
//
$g = new graph();
$g->title( 'Paper Mario, % complete', '{font-size: 18px; color: #A0A0A0;}' );
$g->set_tool_tip( 'Progress, #val#%' );
//
//
// set the X axis labels
$g->set_x_labels( $labels );
//$g->set_data( $data );
//$g->bar_sketch( 50, 6, '#99FF00', '#7030A0', '% Complete', 10 );
//
// add the bar object to the graph
//
$g->data_sets[] = $bar;
$g->set_x_label_style( 10, '#A0A0A0', 0, 1 );
$g->set_y_label_style( 10, '#A0A0A0' );
$g->x_axis_colour( '#A0A0A0', '#FFFFFF' );
$g->set_x_legend( 'Week 1', 12, '#A0A0A0' );
$g->y_axis_colour( '#A0A0A0', '#FFFFFF' );
$g->set_y_min( 0 );
$g->set_y_max( 100 );
$g->y_label_steps( 2 );
$g->set_width( 400 );
$g->set_height( 250 );
$g->set_output_type('js');
echo $g->render();
?>
Internally the chart object leverages swfobject (it is included
in the download .zip file, in the javascript folder (isn't Open Source cool?!)).
|
|
:: Home - Tutorials - No Data File