|
Use this to experiment with the three attributes that control the animation:
- Delay: seconds, before anything happens
- Cascade: seconds. The difference between when the left and right items start to animate
Try:
Red [drop, delay:0, cascade:1] with Blue [drop, 0.5, cascade:1]
Red [drop, delay:0.5, cascade:2.5] (3 seconds until finished) with Blue [drop, delay:0, cascade:1]
Red [drop, delay:0.2, cascade:0] with Blue [drop, delay:0, cascade:0]
The interesting actionscript: charts/series/bars/base.as
Note how we foward the $_POST variables from this page along to the
chart .php page as $_GET variables in the URL. Don't
forget to urlencode your URL (php urlencode())!!
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",
"550", "200", "9.0.0", "expressInstall.swf",
{"data-file":"gallery/line-chart-on-show-animation.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/line-chart-on-show-animation.php
<?php
include '../php-ofc-library/open-flash-chart.php';
$animation = array();
$delay = array();
$cascade = array();
for($i=1; $i<4; $i++)
{
$animation[] = isset($_GET["animation_$i"])?$_GET["animation_$i"]:'pop-up';
$delay[] = isset($_GET["delay_$i"])?$_GET["delay_$i"]:0.5;
$cascade[] = isset($_GET["cascade_$i"])?$_GET["cascade_$i"]:1;
}
$data_1 = array();
$data_2 = array();
$data_3 = array();
for( $i=0; $i<12.1; $i+=0.2 )
{
$data_1[] = (sin($i) * 1.9) + 7;
$data_2[] = (sin($i) * 1.9);
$data_3[] = (sin($i) * 1.9) - 7;
}
$title = new title( date("D M d Y") );
$line_1_default_dot = new solid_dot();
$line_1_default_dot->size(1)->halo_size(1)->colour('#40230B');
$line_1 = new line();
$line_1->set_default_dot_style($line_1_default_dot);
$line_1->set_values( $data_1 );
$line_1->set_width( 1 );
$line_1->set_colour( '#40230B' );
$line_1->on_show(new line_on_show($animation[0], $cascade[0], $delay[0]));
// ------- LINE 2 -----
$line_2_default_dot = new solid_dot();
$line_2_default_dot->size(2)->halo_size(1)->colour('#138085');
$line_2 = new line();
$line_2->set_default_dot_style($line_2_default_dot);
$line_2->set_values( $data_2 );
$line_2->set_width(2);
$line_2->set_colour( '#138085' );
$line_2->on_show(new line_on_show($animation[1], $cascade[1], $delay[1]));
// ------- LINE 2 -----
$line_3_default_dot = new solid_dot();
$line_3_default_dot->size(2)->halo_size(1)->colour('#9D886B');
$line_3 = new line();
$line_3->set_default_dot_style($line_3_default_dot);
$line_3->set_values( $data_3 );
$line_3->set_width( 1 );
$line_3->set_colour( '#9D886B' );
$line_3->on_show(new line_on_show($animation[2], $cascade[2], $delay[2]));
$y = new y_axis();
$y->set_range( -10, 10, 2);
$y->set_colour('#C0C0C0');
$y->set_grid_colour( '#C0C0C0' );
$x = new x_axis();
$x->colour('#C0C0C0')
->grid_colour('#C0C0C0')
->steps(5)
->offset(false);
$chart = new open_flash_chart();
$chart->set_title( $title );
$chart->add_element( $line_1 );
$chart->add_element( $line_2 );
$chart->add_element( $line_3 );
$chart->set_y_axis( $y );
$chart->set_x_axis( $x );
$chart->set_bg_colour('#D8D8D8');
echo $chart->toString();
|
Adverts:
|