App::ffeedflotr - Visualize data with Perl and Firefox

Max Maischein

Frankfurt.pm

Overview

  • What is App::ffeedflotr?

  • How is App::ffeedflotr useful?

  • How does App::ffeedflotr work?

  • What does App::ffeedflotr need?

Who am I?

  • Max Maischein

  • Frankfurt.pm

  • DZ BANK Frankfurt

  • Deutsche Zentralgenossenschaftsbank

  • Information management

What is App::ffeedflotr?

App::ffeedflotr is a command line program that reads data from STDIN and visualizes it in Firefox.

Why App::ffeedflotr?

An image says more than 1000 words

  • ... if that image is readily available!

  • ... for the data you have!

Why App::ffeedflotr?

  • Numbers and totals available online

  • Debug output of programs

Growth of CPAN testers

Online example:

Growth of CPAN testers

Online example:

 1:    YYYYMM,testers,total,pass,fail
 2:
 3:    199508,31,0,0,0
 4:    199509,15,0,0,0
 5:    201101,2008,333157,289881,27773
 6:    201102,2009,409904,351975,31752
 7:    201103,1908,387248,338211,27300

A picture is worth 1000 words

A picture is worth 1000 words

 1:    perl -aF=, -nle "splice@F,2,2;print qq(@F)"
 2:    | perl -w bin\ffeedflotr.pl
 3:        --time
 4:        --xlen 20
 5:        --color 1=green --color 2=red
 6:        --legend 1=Pass --legend 2=Fail
 7:        stats1.txt

Simpler start

Simpler start

ffeedflotr reads STDIN and writes to Firefox

Simpler start

ffeedflotr reads STDIN and writes to Firefox

 1:  > perl -w bin\ffeedflotr.pl --title test
 2:  1 1
 3:  2 4
 4:  3 9
 5:  4 16
 6:  ^D

Pipes

Also infinite data streams

 1:  > perl -wle "$|++;while(1){print( $i++,' ',rand(10));sleep 1}"

Pipes

Also infinite data streams

 1:  > perl -wle "$|++;while(1){print( $i++,' ',rand(10));sleep 1}"
 2:  0 7.31170654296875

Pipes

Also infinite data streams

 1:  > perl -wle "$|++;while(1){print( $i++,' ',rand(10));sleep 1}"
 2:  0 7.31170654296875
 3:  1 1.4410400390625

Pipes

Also infinite data streams

 1:  > perl -wle "$|++;while(1){print( $i++,' ',rand(10));sleep 1}"
 2:  0 7.31170654296875
 3:  1 1.4410400390625
 4:  2 1.35223388671875

Pipes

Also infinite data streams

 1:  > perl -wle "$|++;while(1){print( $i++,' ',rand(10));sleep 1}"
 2:  0 7.31170654296875
 3:  1 1.4410400390625
 4:  2 1.35223388671875
 5:
 6:  > perl -wle "$|++;while(1){print( $i++,' ',rand(10));sleep 1}"
 7:    | perl -w bin\ffeedflotr.pl
 8:        --stream
 9:        --title test

Live Demo

 1:  perl -wle "$|++;while(1){print( $i++,' ',rand(10));sleep 1}"
 2:    | perl -w bin\ffeedflotr.pl
 3:        --stream
 4:        --title test

Live Demo!

Chart types

  • Line chart

  • Stacked line chart / Area chart

  • Pie chart

  • Scatterplot ( X / Y Chart )

ffeedflotr as development tool

Procedural Map Generation

ffeedflotr as development tool

Procedural Map Generation

  • Random dots

  • Radius of 10 units around every dot

  • Random::PoissonDisc

ffeedflotr as development tool

Procedural Map Generation

  • Random dots

  • Radius of 10 units around every dot

  • Random::PoissonDisc

  • Output:

     1:    > perl -w rdp-test.pl
     2:    
     3:    24.4129655649886	24.416205030866
     4:    28.538216147295	36.9806667873347
     5:    36.3469658463998	31.3267757436954
     6:    ...

Good or Bad?

Radius of 10 units around every dot?

Output:

 1:    > perl -w rdp-test.pl
 2:    
 3:    24.4129655649886	24.416205030866
 4:    28.538216147295	36.9806667873347
 5:    36.3469658463998	31.3267757436954
 6:    ...

Good or Bad?

Radius of 10 units around every dot?

Output:

 1:    > perl -w rdp-test.pl
 2:    
 3:    24.4129655649886	24.416205030866
 4:    28.538216147295	36.9806667873347
 5:    36.3469658463998	31.3267757436954
 6:    ...
 7:
 8:    > perl -w rdp-test.pl | perl -w bin\ffeedflotr.pl
 9:        --type=scatter

Good or Bad ?

Radius of 10 units around every dot?

Output:

 1:    > perl -w rdp-test.pl | perl -w bin\ffeedflotr.pl
 2:        --type=scatter

Good or Bad ?

Debug it

Good or Bad ?

Good

 1:    > perl -w rdp-test.pl | perl -w bin\ffeedflotr.pl
 2:        --type=scatter

Good or Bad ?

Bad

 1:    > perl -w rdp-test.pl | perl -w bin\ffeedflotr.pl
 2:        --type=scatter

Good or Bad ?

Good

 1:    > perl -w rdp-test.pl | perl -w bin\ffeedflotr.pl
 2:        --type=scatter

How does App::ffeedflotr work?

How does App::ffeedflotr work?

Portrait of Buffalo Bob Smith and Howdy Doody: Fort Lauderdale, Florida

Flickr++

How does App::ffeedflotr work?

Portrait of Buffalo Bob Smith and Howdy Doody: Fort Lauderdale, Florida

How does App::ffeedflotr work?

Portrait of Buffalo Bob Smith and Howdy Doody: Fort Lauderdale, Florida

How does App::ffeedflotr work?

Portrait of Buffalo Bob Smith and Howdy Doody: Fort Lauderdale, Florida

How does App::ffeedflotr work?

  • Create Firefox tab (WWW::Mechanize::Firefox)

  • Load flot.js into tab

  • Read input data

  • Transmit data to Firefox

How does App::ffeedflotr work?

  • Create Firefox tab (WWW::Mechanize::Firefox)

  • Load flot.js into tab

  • Read input data

  • Transmit data to Firefox

How does App::ffeedflotr work?

  • Create Firefox tab (WWW::Mechanize::Firefox)

  • Load flot.js into tab

  • Read input data

  • Transmit data to Firefox

  • Plot data with calls to flot.js

How Can I Help?

  • A better name!

  • A module API!

  • More use cases than just mine

  • Plot algorithm for IP addresses (Koch dragon curve / XKCD?)

Sample Code

http://github.com/Corion/App-ffeedflotr

The sample code is available in the Github repo

If I get a good name for the module/app, the code will also be released onto CPAN

App::ffeedflotr

Thank You!

http://github.com/Corion/App-ffeedflotr

The sample code is available in the Github repo

If I get a good name for the module/app, the code will also be released onto CPAN

App::ffeedflotr

Questions?

Max Maischein ( corion@cpan.org )

More Features

  • Time series

  • Legends

  • Line Colors

  • Axis values

  • Background image

More Programs

Graphviz - for non-metric data

GD - for raw plotting