Gallery - Shapes
Add shapes to the chart.
Object: shape( $colour )
- append_value( $v )
Add a shape_point object
Object: shape_point( $x, $y )
$x and $y are translated to chart positions.
Note all items are added to the chart in Z (depth) order. Items added first
are drawn first. So it is a good idea to add your shapes before any charts
so the shapes are drawn in the background (and do not cover the chart items)
A simpler chart can be found on the horizontal bar chart page.
This goes into the <head> of the page:
<script type="text/javascript" src="js/swfobject.js"></script>
<script type="text/javascript">
swfobject.embedSWF(
"open-flash-chart.swf", "my_chart", "700", "300",
"9.0.0", "expressInstall.swf",
{"data-file":"gallery/adv-shapes.php"} );
</script>
This writes the chart into a div with id="my_chart",
right click and view source to see it in action,
[the tutorials have more details]
gallery/adv-shapes.php
<?php
include_once '../php-ofc-library/open-flash-chart.php';
//
// you could draw one larger more complex shape,
// or more simply use 3 shapes to make an arrow
//
function draw_arrow( $x, $y, $length )
{
$width = 0.03;
$top = new shape( '#80B11A' );
$top->append_value( new shape_point( $x, $y+$width ) );
$top->append_value( new shape_point( $x+$length+$width, $y+$width ) );
$top->append_value( new shape_point( $x+$length+$width, $y-$width ) );
$top->append_value( new shape_point( $x, $y-$width ) );
$down = new shape( '#80B11A' );
$down->append_value( new shape_point( $x+$length+$width, $y-$width ) );
$down->append_value( new shape_point( $x+$length+$width, $y-$width-0.37 ) );
$down->append_value( new shape_point( $x+$length-$width, $y-$width-0.37 ) );
$down->append_value( new shape_point( $x+$length-$width, $y-$width ) );
$arrow = new shape( '#80B11A' );
$arrow->append_value( new shape_point( $x+$length-0.2, $y-$width-0.37 ) );
$arrow->append_value( new shape_point( $x+$length, $y-0.6 ) );
$arrow->append_value( new shape_point( $x+$length+0.2, $y-$width-0.37 ) );
return array( $top, $down, $arrow );
}
function today()
{
$today = new shape( '#FA6900' );
$today->append_value( new shape_point( 5.9, -0.5 ) );
$today->append_value( new shape_point( 5.9, 5.5 ) );
$today->append_value( new shape_point( 6.1, 5.5 ) );
$today->append_value( new shape_point( 6.1, -0.5 ) );
return $today;
}
$title = new title( "Our New House Schedule" );
$hbar = new hbar( '#7A6A53' );
$hbar->append_value( new hbar_value(0,2) );
$h = new hbar_value(2,3);
$h->set_colour( '#27825C' );
$hbar->append_value( $h );
$hbar->append_value( new hbar_value(4,6) );
$hbar->append_value( new hbar_value(6,8.5) );
$hbar->append_value( new hbar_value(8.5,10) );
$hbar->append_value( new hbar_value(9,11) );
$chart = new open_flash_chart();
$chart->set_title( $title );
//
// items are added in Z order, so we add the 'today'
// marker first, so it is behind all other items
//
$chart->add_element( today() );
//
// Ugh, this is a bit icky. If you do this,
// you should sub-class 'chart' and add draw_arrow()
// as a method and add the shapes to '$this'
// But using a function makes the tutorial
// simple :-)
//
$shapes = draw_arrow( 2, 5, 0.5 );
foreach( $shapes as $shape )
$chart->add_element( $shape );
//
$shapes = draw_arrow( 3, 4, 1.5 );
foreach( $shapes as $shape )
$chart->add_element( $shape );
$shapes = draw_arrow( 6, 3, 0.5 );
foreach( $shapes as $shape )
$chart->add_element( $shape );
//
// we add the bars last so they are foremost
// (Z order)
//
$chart->add_element( $hbar );
//
$chart->add_y_axis( new y_axis() );
$x = new x_axis();
$x->set_offset( false );
$x->set_labels_from_array( array('Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec') );
$chart->set_x_axis( $x );
$y = new y_axis();
$y->set_offset( true );
$y->set_labels(
array(
"Put up shelves",
"Ask for tools from Santa",
"Make garden look sexy",
"Buy shovel",
"Paint house",
"Move into house" ) );
$chart->add_y_axis( $y );
echo $chart->toPrettyString();
|
Adverts:
|