Open Flash Chart

:: Home - Gallery - Bar Chart

Info: Open Flash Chart 2 is out. Version 1.x and these pages will never disappear and the charts will continue working forever, but further development on 1.x has stopped. Take a look at version 2 here Open Flash Chart 2.

Gallery - Bar Chart

Personally, I like the bars to have some alpha transparancy so when the user mouse overs a bar the alpha = 0%, this gives quite nice feedback.

Object: bar_outline()

bar_outline( integer $alpha, string $colour, string $outline_colour )

This creates a set of bars and draws them with an outline, like above.

All bar charts have optional settings which are listed below:

Method: key()

key( string $key, integer $size )

e.g:

$bar = new bar_outline( 50, '#9933CC', '#8010A0' );
$bar->key( 'Page views', 10 );

This sets the legend key string and size. The colour of the legend is the same as the bar colour.

Attribute: data

e.g:

$bar->data[] = 10;
$bar->data[] = 20;

This example adds 2 bars. You can add as many as you want.

Method: add()

$bar->add( integer $data, string $link )

This is a bit more complicated, so ignore it for now. It is explained in the bar links page.

Create the flash object

<?php
include_once 'ofc-library/open_flash_chart_object.php';
open_flash_chart_object( 450, 300, 'http://'. $_SERVER['SERVER_NAME'] .'/open-flash-chart/gallery-data-14.php' );
?>

gallery-data-14.php

<?php

include_once( 'ofc-library/open-flash-chart.php' );

// generate some random data
srand((double)microtime()*1000000);

$bar = new bar_outline( 50, '#9933CC', '#8010A0' );
$bar->key( 'Page views', 10 );

$data = array();
for( $i=0; $i<9; $i++ )
{
  $bar->data[] = rand(5,9);
}


$g = new graph();
$g->title( 'Bar Chart', '{font-size: 20px;}' );

//
// BAR CHART:
//
//$g->set_data( $data );
//$g->bar_filled( 50, '#9933CC', '#8010A0', 'Page views', 10 );
//
// ------------------------
//
$g->data_sets[] = $bar;
//
// X axis tweeks:
//
$g->set_x_labels( array( 'January','February','March','April','May','June','July','August','September' ) );
//
// set the X axis to show every 2nd label:
//
$g->set_x_label_style( 10, '#9933CC', 0, 2 );
//
// and tick every second value:
//
$g->set_x_axis_steps( 2 );
//


$g->set_y_max( 10 );
$g->y_label_steps( 4 );
$g->set_y_legend( 'Open Flash Chart', 12, '#736AFF' );
echo $g->render();
?>

To see the data produced : gallery-data-14.php, then 'view source'.

Help support the project:

Adverts:

AnyChart - flash charts, maps and dashboards