Raymond Camden's ColdFusion Blog: Another charting option: XML/SWF Charts

Another charting option: XML/SWF Charts

A few weeks ago I blogged about an alternative to ColdFusion's built in charts, Google's Chart API. This week I discovered another alternative, XML/SWF Charts. This isn't a free option, but they have a free license with limitations and the price for a "full" copy is only 45 bucks for a single domain. It works pretty easy too.

You basically drop in a set of SWF files and then call the SWF and point to a XML file:

view plain print about

<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
	codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" 
	WIDTH="400" 
	HEIGHT="250" 
	id="charts" 
	ALIGN="">
<PARAM NAME=movie VALUE="charts.swf?library_path=charts_library&xml_source=sample.xml">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#666666>

<EMBED src="charts.swf?library_path=charts_library&xml_source=sample.xml"
       quality=high 
       bgcolor=#666666  
       WIDTH="400" 
       HEIGHT="250" 
       NAME="charts" 
       ALIGN="" 
       swLiveConnect="true" 
       TYPE="application/x-shockwave-flash" 
       PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
</EMBED>
</OBJECT>

1  <OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
2      codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
3      WIDTH="400"
4      HEIGHT="250"
5      id="charts"
6      ALIGN="">
7  <PARAM NAME=movie VALUE="charts.swf?library_path=charts_library&xml_source=sample.xml">
8  <PARAM NAME=quality VALUE=high>
9  <PARAM NAME=bgcolor VALUE=#666666>
10
11  <EMBED src="charts.swf?library_path=charts_library&xml_source=sample.xml"
12   quality=high
13   bgcolor=#666666
14   WIDTH="400"
15   HEIGHT="250"
16   NAME="charts"
17   ALIGN=""
18   swLiveConnect="true"
19   TYPE="application/x-shockwave-flash"
20   PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
21  </EMBED>
22  </OBJECT>

Your XML file has all the data and options to drive the chart. You can point to a ColdFusion file as well to have dynamic data. The set of chart types is pretty impressive, as is all the options you can use, including funky animations and layout. See the gallery for examples. Probably the coolest option they have though is their live update option. This lets you point to XML data and automatically refresh every N seconds. Here is an example that points to a CFM on my server. Region C will change every 2 seconds.

This entry was posted on Friday, January 4, 2008 at 7:34 AM. It was filed in the following categories: Development, Flash. It has been viewed 6,323 times and has 20 comments.

TweetBacks

Comments

[Add Comment] [Subscribe to Comments]

Comment 1 written by Raymond Camden on 4 January 2008, at 7:59 AM

Just a quick comment to my own post. I noticed in Firefox 3, OSX, the chart example above isn't centered right. It worked fine on my local server, and worked fine in the blog admin, so I'm thinking some CSS may be messing with it. The same blog entry works fine in Safari. So blame FF3/my css, not the chart engine.
Comment 2 written by todd sharp on 4 January 2008, at 8:10 AM

*All* regions are updating every 2 seconds...not just 'C'
Comment 3 written by todd sharp on 4 January 2008, at 8:11 AM

Nope I lied and shall be banned from all comments on this blog for the rest of the day.
Comment 4 written by Andy Matthews on 4 January 2008, at 8:41 AM

I found a great set of free Flash charts that I used for a recent app I built. They're XML based and SUPER easy to use:

http://www.fusioncharts.com/free/
Comment 5 written by Gareth on 4 January 2008, at 9:09 AM

Wow, those are impressive! Wonder why they're free though...seems like something they could easily charge for.
Comment 6 written by David Boyer on 4 January 2008, at 9:11 AM

I discovered an open source alternative for flash charts. In my opinion they do look pretty good, plus I'm sure once the developer manages to get a copy of Flash 9, they'll get a whole lot better.

http://teethgrinder.co.uk/open-flash-chart/
Comment 7 written by Raymond Camden on 4 January 2008, at 9:14 AM

@Gareth: Check the license for XML/SWF. The free version blocks linking, so you can't tie a bar to a url for example. (That's based on my super quick reading.) The 45 dollar version doesn't have this limit.
Comment 8 written by Eric Hynds on 4 January 2008, at 10:05 AM

If you're already implementing jQuery, take a look a Flot: http://code.google.com/p/flot/
Comment 9 written by Darth Sidious on 4 January 2008, at 10:55 AM

If you want to see some *AMAZING* charting checkout GlobFX:

http://www.globfx.com/products/swfchart/samples.ph...

What's awesome about it is they use a CSS concept for the styling, so the design and logic are completely separate. Want to change your chart from a stacked area to a column series? No problem, just update your chart style sheet.

And the Stylesheet granularity is crazy. The level of minute detail that you can control. But here's the best part - creating these style sheets is done in a style sheet tool that non developers can use, so you can let your marketing or project management team set up the style that they want and then they just hand over the style sheet to you and you're done. The tool let's you punch in some mock data so that you can see what the style is going to look like without having to plug it into a back end.

They have Coldfusion samples available.

Check out the gallery:
http://www.globfx.com/products/swfchart/samples.ph...
Comment 10 written by Andy Matthews on 4 January 2008, at 11:00 AM

Those are freaking amazing!
Comment 11 written by Kevin on 4 January 2008, at 1:35 PM

I did a project using the XML/SWF charts last year with some nice success (I'd link but the charts are all behind a login). It was easy to use (I was using PHP for that project but it would have been even easier with CF) and the client loved the look of them. Anyhow, it was certainly worth the $45 dollars since it would have taken way more money to build it myself.
Comment 12 written by Gary on 7 January 2008, at 5:18 PM

We use Kavachart for all our visualization.
They have some good documentation on integrating with CF, and my experience with their support has been great.

http://www.ve.com/kavachart/gallery.html
Comment 13 written by vin45 on 16 June 2008, at 6:08 AM

hey guys, I have found a set of open source chart controller called http://visifire.com powered by silverlight just for free
Comment 14 written by flicker on 6 August 2008, at 7:16 PM

A new version 5 of XML/SWF Charts is now available:
http://www.maani.us/xml_charts

It includes scrolling, streaming, full screen mode, filter effects, and much more!
Comment 15 written by Darin on 25 February 2009, at 3:50 PM

Has anyone tried to use XML/SWF Charts to connect to a database? I can not get this to work. Their support is not most timely nor precise.

Thanks
Comment 16 written by Raymond Camden on 26 February 2009, at 1:55 PM

How is it failing for you? The charts don't connect to a DB themselves. You would use live update to hit an XML file generated by CF. So you want ot be sure your code is outputting the right result.
Comment 17 written by Meg Stiles on 22 May 2009, at 1:52 PM

We've been using XML/SWF Charts in dev in a Mac OSX/Dreamweaver CS3 environment; with our animations embedded in aspx files. Just recently we discovered that the animations fail in IE. The author is not very helpful. Our developers are convinced that it has to do with the versioning scripting in the AC_RunActiveContent.js file. Works perfectly in Safari and Firefox. Sadly, our user base is 99% PC, and I suspect 99% will be using IE. Has anyone else had this problem? Any ideas/workarounds?
Comment 18 written by Donny on 21 July 2009, at 2:23 AM

Is there license for XML/SWF 5.07?
Comment 19 written by sandeep on 24 February 2010, at 1:34 AM

Have problems in using xml swf charts through ajax calls.
I am able to get the response from ajax but while executing the script the page is getting re-loaded
Comment 20 written by Raymond Camden on 24 February 2010, at 6:16 AM

Sounds like maybe a JS error. Is this online where we can see?