Home > Uncategorized > Beautiful Flash Charts: Part II

Beautiful Flash Charts: Part II

June 13th, 2008

So, it appears as if there was some pent up demand for great looking flash charts. The brief couple of days that my initial post on my rough integration work with Open Flash Charts I’ve had:
- 2 Pentaho Partners ask for the solution so they can start using it
- 3 Community members ask about it (including one who started but never finished a similar task)
- An existing customer decide to implement it

Cool! As an open source guy, I believe in early and often, so I’m posting my .xactions for this stuff here.

Installation Steps

  1. Have a working Sample BI Server
  2. Drop open-flash-chart-.swf into pentaho-demo/jboss/server/default/deploy/pentaho-style.war pentaho-demo/jboss/server/default/deploy/pentaho-style.war/images (nice catch in comments below)
  3. Drop flash_chart_example_bar.xaction and flash_chart_example.xaction into pentaho-solutions/samples/charts

That should you get two the sample bar chart and the sample pie chart working.

These action sequences are kind of fancy. They do a fair bit of string replacements, result set walking, etc. So, they aren’t for the casual user but if you’ve done some Pentaho stuff before you’ll be able to work your way through it.

The interesting part is really the “datacall=true” branch. The first time the action sequence is called it returns a fragment of code that contains the flash object.

<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=”600″ height=”500″ id=”graph-2″ align=”middle”><param name=”allowScriptAccess” value=”sameDomain” /> <param name=”movie” value=”/pentaho-style/images/open-flash-chart.swf?width=600&height=500&data=http%3A//localhost%3A8080/pentaho/ViewAction%3Fsolution%3Dsamples%26path%3Dcharts%26action%3Dflash_chart_example_bar.xaction%26datacall%3Dtrue” /> <param name=”quality” value=”high” /><param name=”bgcolor” value=”#FFFFFF” /> <embed src=”/pentaho-style/images/open-flash-chart.swf?width=600&height=500&data=http%3A//localhost%3A8080/pentaho/ViewAction%3Fsolution%3Dsamples%26path%3Dcharts%26action%3Dflash_chart_example_bar.xaction%26datacall%3Dtrue” quality=”high” bgcolor=”#FFFFFF” width=”600″ height=”500″ name=”open-flash-chart” align=”middle” allowScriptAccess=”sameDomain” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” /> </object>

In this fragment, the flash object is given a “datafile” location which is the same action sequence but with a datacall=true.

The datacall=”true” basically returns a text file that looks like this:

&y_min=0& &y_max=40000000& &y_steps=4& &title=Actual vs Budget by Region,{font-size:20px; color: #bcd6ff; margin:10px; background-color: #5E83BF; padding: 5px 15px 5px 15px;}& &y_legend=USD,12,#736AFF& &x_labels=Central,Eastern,Southern,Western& &x_axis_colour=#909090& &x_grid_colour=#D2D2FB& &y_axis_colour=#909090& &y_grid_colour=#D2D2FB& &bar_glass=55,#D54C78,#C31812,Actuals,12& &values=37893162,35248940,35248940,35248940& &bar_glass_2=55,#5E83BF,#424581,Budget,12& &values_2=38397600,35487861,34803861,34510067&

This text file is really what gives the flash chart it’s form, labels, and data.

Again, this is quick and dirty implementation but it’s a life saver if you need something more than the charting in the platform.

Uncategorized

  1. Harris
    June 14th, 2008 at 05:19 | #1

    Cheers Nick!! Im going to give this a try later on. Great work :)

  2. sink25
    June 16th, 2008 at 04:28 | #2

    hey nick chk this out visifire an amazing charting component powered by silverlight

  3. Daniel
    June 16th, 2008 at 12:15 | #3

    Correction: Drop the swf into “pentaho-demo/jboss/server/default/deploy/pentaho-style.war/images”

  4. June 17th, 2008 at 09:25 | #4

    Hi, thanks for the tutorial. Open Flash Chart 2 is out in alpha. The data file is a bit more coherant as it is now JSON. It makes the libraries much simpler to implement. It also means the chart can talk to javascript easily.

    cheers,

    monk.e.boy

  5. Carlos
    July 1st, 2008 at 07:39 | #5

    Hi nick, i have tried your examples and they work well, thanks for posting them, now i am going deeper and i would like to know if you have tried drill-down on Open Flash Chart, if you have how you did it?

    Thanks

    Carlos

  6. DMurray3
    November 7th, 2008 at 20:54 | #6

    Hi Nick… Great blog. Unfortunately, I followed your steps word for word and am getting the following error:
    “start quote
    Open Falsh Chart
    IO ERROR
    Loading test data
    ERROR #2032
    This is the URL I tried to open../data-files/area-point-objects.txt
    endquote”
    I am using Pentaho BI Platform 1.7.0.1062 on Windows XP-SP2; Firefowz 3.03.
    If you get a chance, would very much appreciate any suggestions.

    Thanks,
    DMurray3

  7. DMurray3
    November 9th, 2008 at 00:49 | #7

    Hi Nick and all readers… I found the solution to my pevious comment on
    http://code.google.com/p/pentahoflashcharts/

    Thanks again Nick for a great solution.

  8. shyam
    January 11th, 2009 at 22:10 | #8

    Hi nick,

    i am using the pentaho 2.0 version
    http://code.google.com/p/pentahoflashcharts/
    i downloaded the following files from
    1) pentahoflashchart-0.1-r105.jar
    2) pentahoflashchart-samples-0.1-r105.zip
    and i followed the given steps .
    After follwoing your steps when i am trying to execute its resulting me
    with the following exception
    java.lang.NoClassDefFoundError: org/pentaho/plugin/jfreechart/ChartComponent

    i ur downloaded zip file icant find two jar files that u had mentioned please can u help me in solving this problem

  9. shyam
    January 11th, 2009 at 22:14 | #9

    Nick,
    i am getting the following thing in tomcat logs..

    java.lang.ClassNotFoundException: org.pentaho.plugin.jfreechart.ChartComponent
    at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoa der.java:1363)
    at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoa der.java:1209)
    at java.lang.ClassLoader.loadClassInternal(ClassLoader.java:320)
    at java.lang.ClassLoader.defineClass1(Native Method)
    at java.lang.ClassLoader.defineClass(ClassLoader.java:621)
    at java.security.SecureClassLoader.defineClass(SecureClassLoader.java:12

  1. No trackbacks yet.