How to use FlyCharts

To display FlyCharts you just need to integrate SWF component into your HTML page with 2 possible methods.

Method A: direct HTML embedding

<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="550" HEIGHT="400" id="graph" name="graph" ALIGN="">
<PARAM NAME=movie VALUE="GRAPH.swf?dataUrl=data.xml">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src="GRAPH.swf?dataUrl=data.xml" quality=high bgcolor=#FFFFFF WIDTH="550" HEIGHT="400" NAME="graph" NAME="id" ALIGN="" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
</OBJECT>

Method B: javascript embedding

<script type="text/javascript" src="swfobject.js"></script>
<div id="grapharea">
Flash object cannot be loaded.
</div>
<script type="text/javascript">
var so = new SWFObject("GRAPH.swf?dataUrl=data.xml","graph","550","400","7","#336699");
so.write("grapharea");
</script>

GRAPH.swf is a name of your component on the server side. data.xml is a name of XML data source file also place on the server side.

Method B is recommended as it is working on all client systems. Method A is standard embedding that is provided by Adobe company. Nevertheless you can find both two methods in download package to chose from.

Example of simple XML file:

<?xml version="1.0" encoding="UTF-8"?>
<graph top="40" left="80">

<chartScene width="400" height="300">
<color>cccccc, ffffff, ffffff</color>
<opacity>30, 10, 10</opacity>
<border>2</border>
<borderColor>cccccc</borderColor>
</chartScene>

<axis yname="Y axis" xname="X axis">
<x-axis start="1999" end="2100" interval="1" intervalLine="40"/>
<y-axis start="0" end="230" valueinterval="40" interval="40" intervalLine="40"/>
</axis>

<chart type="line">
<set name="Value 1" value="100" color="FF0000"/>
<set name="Value 2" value="150" color="FF00D3"/>
<set name="Value 3" value="120" color="A4F94E"/>
<set name="Value 4" value="160" color="3334FF"/>
<set name="Value 5" value="20" color="3334FF"/>
</chart>

</graph>

You can try FlyCharts by downloading trial version here.

  • Your opinion
  • FAQ
  • Buy $99