Open Flash Chart and Perl
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Open Flash Chart and PerlYAPC::EU 2008
Josh McAdams
Why chart data?
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Why chart data?
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Charting Options in Perl
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
• GD::Graph• Chart• Google::Chart• SWF::Chart• Chart::OFC• ... and many more I’m sure
Open Flash Chart Samples
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Lifecycle of a Chart Request
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Adding a Chart to a Page
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="450" height="300" id="graph-2" align="middle"><param name="allowScriptAccess" value="sameDomain" /><param name="movie"
value="open-flash-chart.swf?width=450&height=300&data=data.txt" /><param name="quality" value="high" /><param name="bgcolor" value="#FFFFFF" /><embed src="open-flash-chart.swf?width=450&height=300&data=data.txt"
quality="high" bgcolor="#FFFFFF" width="450" height="300" name="open-flash-chart" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
Data File Format
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
&title=World Population,{ font-size: 25px }&&pie=80,#000000,{font-size: 12px; color: #404040;}&&pie_labels=China,India,US,Indonesia,Other&&colours=#FF0000,#0000FF,#00FF00,#FFFF00,#FFA500,#A020F0,#000000&&values=1325507000,1136665600,304858000,231627000,3904195400&
Creating Chart Data With Perl
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Chart::OFC::Pie->new( title => 'World Population', dataset => Chart::OFC::Dataset->new(
values => [ 1_325_507_000, 1_136_665_600, 304_858_000, 231_627_000, 3_904_195_400
] ),
label_style => 'font-size: 12px; color: #404040;', labels =>
[qw( China India US Indonesia Other)],)->as_ofc_data();
Chart::OFC Object Model
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Chart::OFC Object Model
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Chart::OFC Object Model
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example Charts on OFC Site
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
•Data Lines•Bar Chart•Bar Chart 2•3D Bar Chart•Glass Bar Chart•Fade Bar Chart•Sketch Bars•Area Chart•Area Chart - 2•Bars + Lines•Pie Chart•Pie Chart Links•Scatter Chart•Mixed Scatter•High Low Close•Candle
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
6 my ( @data1, @data2, @data3 ); 7 8 for ( 1 .. 12 ) { 9 push @data3, 1 + int( rand(7) ); 10 push @data2, 8 + int( rand(6) ); 11 push @data1, 14 + int( rand(6) ); 12 }
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
14 my $chart = Chart::OFC::Grid->new( 15 title => 'Many data lines', 16 title_style =>
'{font-size: 20px; color: #736AFF}', 17 datasets => [
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
14 my $chart = Chart::OFC::Grid->new( 15 title => 'Many data lines', 16 title_style =>
'{font-size: 20px; color: #736AFF}', 17 datasets => [
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
18 Chart::OFC::Dataset::Line->new( 19 values => \@data1, 20 width => 2, 21 color => '#9933CC', 22 label => 'Page Views', 23 text_size => 10, 24 ),
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
25 Chart::OFC::Dataset::LineWithDots->new( 26 values => \@data2, 27 solid_dots => 1, 28 width => 3, 29 color => '#CC3399', 30 label => 'Downloads', 31 text_size => 10, 32 dot_size => 5, 33 ),
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
34 Chart::OFC::Dataset::LineWithDots->new( 35 values => \@data3, 36 solid_dots => 0, 37 width => 2, 38 color => '#80a033', 39 label => 'Bounces', 40 text_size => 10, 41 dot_size => 4, 42 ), 43 ],
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
44 x_axis => Chart::OFC::XAxis->new( 45 labels => [ 46 qw(January February March 47 April May June 48 July August September 49 October November December) 50 ], 51 axis_label => '', 52 orientation => 'horizontal', 53 label_steps => 2, 54 ),
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
55 y_axis => Chart::OFC::YAxis->new( 56 axis_label => Chart::OFC::AxisLabel->new( 57 label => 'Open Flash Chart', 58 text_size => 12, 59 text_color => '#736AFF', 60 ), 61 min => 0, 62 max => 20, 63 label_steps => 5, 64 ),
Example - Data Lines
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
6 my $chart = Chart::OFC::Grid->new( 7 title => 'Bar Chart', 8 title_style => '{font-size: 20px;}',
Example - Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
9 datasets => [ 10 Chart::OFC::Dataset::OutlinedBar->new( 11 label => 'Page Views', 12 fill_color => '#9933CC', 13 outline_color => '#8010A0', 14 opacity => 50, 15 values =>
[ map { 5 + int( rand(4) ) } ( 1 .. 9 ) ], 16 ) 17 ],
Example - Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
18 x_axis => Chart::OFC::XAxis->new( 19 labels => [ 20 qw(January February March 21 April May June 22 July August Spetember) 23 ], 24 axis_label => '', 25 orientation => 'horizontal', 26 label_steps => 2, 27 text_color => '#9933CC', 28 ), 29 y_axis => Chart::OFC::YAxis->new( 30 axis_label => Chart::OFC::AxisLabel->new( 31 label => 'Open Flash Chart', 32 text_size => 12, 33 text_color => '#736AFF', 34 ), 35 min => 0, 36 max => 10, 37 label_steps => 2, 38 ),
Example - Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar Chart Two
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar Chart Two
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
9 datasets => [ 10 Chart::OFC::Dataset::Bar->new( 11 label => 'Me', 12 fill_color => '#0066CC', 13 opacity => 50, 14 text_size => 10, 15 values => [ map { 2 + int( rand(3) ) } ( 1 .. 9 ) ], 16 ), 17 Chart::OFC::Dataset::Bar->new( 18 label => 'You', 19 fill_color => '#9933CC', 20 opacity => 50, 21 text_size => 10, 22 values => [ map { 5 + int( rand(4) ) } ( 1 .. 9 ) ], 23 ), 24 Chart::OFC::Dataset::Bar->new( 25 label => 'Them', 26 fill_color => '#639F45', 27 opacity => 50, 28 text_size => 10, 29 values => [ map { 2 + int( rand(7) ) } ( 1 .. 9 ) ], 30 ), 31 ],
Example - Bar Chart Two
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - 3D Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - 3D Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
10 datasets => [ 11 Chart::OFC::Dataset::3DBar->new( 12 label => 2006, 13 fill_color => '#D54C78', 14 values => [ map { 2 + int( rand(4) ) } ( 1 .. 10 ) ], 15 ), 16 Chart::OFC::Dataset::3DBar->new( 17 label => 2007, 18 fill_color => '#3334AD', 19 values => [ map { 5 + int( rand(5) ) } ( 1 .. 10 ) ], 20 ), 21 ],
Example - 3D Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - 3D Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
22 x_axis => Chart::OFC::XAxis->new( 23 labels => [ 24 qw(January February March 25 April May June 26 July August Spetember 27 October) 28 ], 29 axis_label => '', 30 orientation => 'horizontal', 31 label_steps => 2, 32 text_color => '#000000', 33 three_d_height => 12, 34 axis_color => '#909090', 35 grid_color => '#ADB5C7', 36 ),
Example - 3D Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Glass Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Glass Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
11 Chart::OFC::Dataset::GlassBar->new( 12 opacity => 55, 13 label => 2006, 14 fill_color => '#D54C78', 15 outline_color => '#C31812', 16 values =>
[ map { 2 + int( rand(4) ) } ( 1 .. 10 ) ], 17 ),
Example - Glass Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Fade Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Fade Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
12 Chart::OFC::Dataset::FadeBar->new( 13 opacity => 55, 14 label => 2006, 15 fill_color => '#C31812', 16 values => [ map { 2 + int( rand(4) ) } ( 1 .. 10 ) ], 17 ), 18 Chart::OFC::Dataset::FadeBar->new( 19 opacity => 55, 20 label => 2007, 21 fill_color => '#424581', 22 values => [ map { 5 + int( rand(5) ) } ( 1 .. 10 ) ], 23 ), 24 ],
Example - Fade Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Sketch Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Sketch Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
12 datasets => [ 13 Chart::OFC::Dataset::SketchBar->new( 14 opacity => 55, 15 label => 2006, 16 fill_color => '#D070AC', 17 outline_color => '#000000', 18 randomness => 6, 19 values =>
[ map { 2 + int( rand(8) ) } ( 1 .. 10 ) ], 20 ), 21 ],
Example - Sketch Bar Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Area Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Area Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
7 my ( @data, @labels ); 8 for ( my $i = 0 ; $i < 6.2 ; $i += 0.2 ) { 9 my $val = sin($i) * 1.9; 10 push @data, $val; 11 push @labels, sprintf( "%.2f", $val ); 12 }
Example - Area Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
17 datasets => [ 18 Chart::OFC::Dataset::Area->new( 19 opacity => 25, 20 fill_color => '#CC3399', 21 color => '#CC3399', 22 dot_size => 3, 23 width => 2, 24 values => \@data, 25 ), 26 ],
Example - Area Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Area Chart Two
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar and Line Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Bar and Line Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
9 datasets => [ 10 Chart::OFC::Dataset::Bar->new( 11 label => 'Purple Bar', 12 fill_color => '#9933CC', 13 opacity => 50, 14 text_size => 10, 15 values =>
[ map { 2 + int( rand(4) ) } ( 1 .. 9 ) ], 16 ),
Example - Bar and Line Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
17 Chart::OFC::Dataset::Bar->new( 18 label => 'Green Bar', 19 fill_color => '#339966', 20 opacity => 50, 21 text_size => 10, 22 values =>
[ map { 4 + int( rand(4) ) } ( 1 .. 9 ) ], 23 ),
Example - Bar and Line Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
24 Chart::OFC::Dataset::LineWithDots->new( 25 width => 3, 26 dot_size => 5, 27 color => '#CC3399', 28 label => 'Line', 29 text_size => 10, 30 solid_dots => 1, 31 values =>
[ map { 5 + int( rand(5) ) } ( 1 .. 9 ) ], 32 ), 33 ],
Example - Bar and Line Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Pie Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Pie Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
6 print Chart::OFC::Pie->new( 7 opacity => 60, 8 line_color => '#505050', 9 title => 'Pie Chart', 10 title_style => 'font-size:18px; color: #d01f3c;', 11 label_style => 'font-size: 12px; color: #404040;', 12 dataset => Chart::OFC::Dataset->new( 13 values => [ map { 5 + int( rand(11) ) } ( 1 .. 5 ) ], 14 ), 15 labels => [qw( IE Firefox Opera Wii Other)], 16 slice_colors => [ '#d01f3c', '#356aa0', '#C79810' ], 17 tool_tip => '#val#%25', 18 )->as_ofc_data();
Example - Pie Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Pie Chart With Links
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Pie Chart With Links
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
6 my $values = [ map { 5 + int( rand(11) ) } ( 1 .. 5 ) ]; 7 my $links = [ map { "javascript:alert('$_')" } @$values ]; 8 9 print Chart::OFC::Pie->new( 10 bg_color => '#E4F0DB', 11 opacity => 60, 12 line_color => '#E4F0DB', 13 label_style => 'display:none;', 14 title => 'Pie Chart', 15 title_style => 'font-size:18px; color: #d01f3c;', 16 dataset =>
Chart::OFC::Dataset->new( values => $values, links => $links ), 17 labels => [qw( IE Firefox Opera Wii Other)], 18 slice_colors => [ '#d01f3c', '#356aa0', '#C79810' ], 19 tool_tip => 'Label: #x_label#<br>Value: #val#%&', 20 )->as_ofc_data();
Example - Pie Chart With Links
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Scatter Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Scatter Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
X
Example - Mixed Scatter Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Mixed Scatter Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
X
Example - High Low Close Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - High Low Close Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
X
Example - Candle Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
Example - Candle Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
X
Things That Suck About OFC::Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
• Not all of OFC• Documentation• Some bugs
Things That Rock About OFC::Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
• Easy Coding• Easy to Read Code• Pretty Charts by Default
Things To Expect Soon In OFC::Chart
Open Flash Chart and Perl - YAPC::EU August 2008 - Copenhagen
• A bug fix release• Support for OFC2