Tiny File Manager

Back Back Up Advanced Editor

<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>FusionCharts Free Documentation</title>
<link rel="stylesheet" href="Style.css" type="text/css" />
</head>

<body>
<table width="98%" border="0" cellspacing="0" cellpadding="3" align="center">
 <tr> 
 <td><h2 class="pageHeader">dataXML method</h2></td>
 </tr>
 <tr> 
 <td valign="top" class="text">In our previous examples, we had used the 
 dataURL method to provide data to FusionCharts. 
 In dataURL method, the data is contained in an external physical XML document 
 (like Data.xml) or relayed by a URL (like 
 ReturnXMLData.asp). 
 There also exists another method to provide the XML data to FusionCharts 
 - dataXML method. 
 
 In this method, the XML Data exists in the same HTML page in which FusionCharts 
 is embedded. When working with this method, you don't need to create the 
 external XML document (like Data.xml). 
 Instead you provide it in the HTML page. 
 Let's quickly see an example of the above.</td>
 </tr>
 <tr> 
 <td valign="top" class="text">&nbsp;</td>
 </tr>
 <tr> 
 <td valign="top" class="header">Using dataXML method in direct HTML embedding</td>
 </tr>
 <tr> 
 <td valign="top" class="text">Create a copy of Chart.html 
 and save it as ChartDataXML.html. Also, 
 modify the code as under:</td>
 </tr>
 <tr> 
 <td valign="top" class="codeBlock">&lt;html&gt; &lt;body bgcolor=&quot;#ffffff&quot;&gt; 
 &lt;OBJECT classid=&quot;clsid:D27CDB6E-AE6D-11cf-96B8-444553540000&quot; codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0&quot; width=&quot;600&quot; height=&quot;500&quot; id=&quot;Column3D&quot; &gt; 
 &nbsp;&nbsp;&nbsp;&lt;param name=&quot;movie&quot; value=&quot;../FusionCharts/FCF_Column3D.swf?chartWidth=600&amp;chartHeight=500&quot; 
 /&gt; 
 &nbsp;&nbsp;&nbsp;&lt;param name=&quot;FlashVars&quot; 
 value=&quot;&amp;dataXML=&lt;graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'&gt;&lt;set name='Jan' value='462' color='AFD8F8' /&gt;&lt;set name='Feb' value='857' color='F6BD0F' /&gt;&lt;set name='Mar' value='671' color='8BBA00' /&gt;&lt;set name='Apr' value='494' color='FF8E46'/&gt;&lt;set name='May' value='761' color='008E8E'/&gt;&lt;set name='Jun' value='960' color='D64646'/&gt;&lt;set name='Jul' value='629' color='8E468E'/&gt;&lt;set name='Aug' value='622' color='588526'/&gt;&lt;set name='Sep' value='376' color='B3AA00'/&gt;&lt;set name='Oct' value='494' color='008ED6'/&gt;&lt;set name='Nov' value='761' color='9D080D'/&gt;&lt;set name='Dec' value='960' color='A186BE'/&gt;&lt;/graph&gt;&quot;&gt; 
 &nbsp;&nbsp;&nbsp;&lt;param 
 name=&quot;quality&quot; value=&quot;high&quot; /&gt; 
 &nbsp;&nbsp;&nbsp;&lt;embed 
 src=&quot;../FusionCharts/FCF_Column3D.swf?chartWidth=600&amp;chartHeight=500&quot; flashVars=&quot;&amp;dataXML=&lt;graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'&gt;&lt;set name='Jan' value='462' color='AFD8F8' /&gt;&lt;set name='Feb' value='857' color='F6BD0F' /&gt;&lt;set name='Mar' value='671' color='8BBA00' /&gt;&lt;set name='Apr' value='494' color='FF8E46'/&gt;&lt;set name='May' value='761' color='008E8E'/&gt;&lt;set name='Jun' value='960' color='D64646'/&gt;&lt;set name='Jul' value='629' color='8E468E'/&gt;&lt;set name='Aug' value='622' color='588526'/&gt;&lt;set name='Sep' value='376' color='B3AA00'/&gt;&lt;set name='Oct' value='494' color='008ED6'/&gt;&lt;set name='Nov' value='761' color='9D080D'/&gt;&lt;set name='Dec' value='960' color='A186BE'/&gt;&lt;/graph&gt;&quot; 
 quality=&quot;high&quot; width=&quot;600&quot; height=&quot;500&quot; name=&quot;Column3D&quot; 
 type=&quot;application/x-shockwave-flash&quot; pluginspage=&quot;http://www.macromedia.com/go/getflashplayer&quot; 
 /&gt; 
 &lt;/object&gt; &lt;/body&gt; &lt;/html&gt;</td>
 </tr>
 <tr> 
 <td valign="top" class="text">As you can see above, we have provided the 
 complete data by appending it as a FlashVars 
 attribute in the following format: 
 &lt;PARAM NAME=&quot;FlashVars&quot; Value=&quot;&amp;dataXML=completeXMLData&quot;&gt; 
 
 and in the EMBED tag, you'll have to add the following: 
 &lt;EMBED ... FlashVars=&quot;&amp;dataXML=completeXMLData&quot;&gt; 
 
 This way you can have FusionCharts to load data from the same page in 
 which it's embedded.</td>
 </tr>
 <tr> 
 <td valign="top" class="text">&nbsp;</td>
 </tr>
 <tr> 
 <td valign="top" class="header">Using dataXML method while embedding chart 
 using JavaScript</td>
 </tr>
 <tr> 
 <td valign="top" class="text">If you're using FusionCharts 
 JavaScript class to embed the chart, you can use dataXML 
 with it as under:</td>
 </tr>
 <tr> 
 <td valign="top" class="codeBlock">&lt;html&gt; &lt;head&gt; &nbsp;&nbsp;&nbsp;&lt;script 
 language=&quot;JavaScript&quot; src=&quot;../FusionCharts/FusionCharts.js&quot;&gt;&lt;/script&gt; 
 &lt;/head&gt; &lt;body bgcolor=&quot;#ffffff&quot;&gt;
 &nbsp;&nbsp;&nbsp;&lt;div id=&quot;chartdiv&quot; align=&quot;center&quot;&gt;The 
 chart will appear within this DIV. This text will be replaced by the chart.&lt;/div&gt; 
 &nbsp;&nbsp;&nbsp;&lt;script type=&quot;text/javascript&quot;&gt; 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var myChart = new FusionCharts(&quot;../FusionCharts/FCF_Column3D.swf&quot;, 
 &quot;myChartId&quot;, &quot;600&quot;, &quot;500&quot;); 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;myChart.setDataXML(&quot;&lt;graph caption='Monthly Unit Sales' xAxisName='Month' yAxisName='Units' showNames='1' decimalPrecision='0' formatNumberScale='0'&gt;&lt;set name='Jan' value='462' color='AFD8F8' /&gt;&lt;set name='Feb' value='857' color='F6BD0F' /&gt;&lt;set name='Mar' value='671' color='8BBA00' /&gt;&lt;set name='Apr' value='494' color='FF8E46'/&gt;&lt;set name='May' value='761' color='008E8E'/&gt;&lt;set name='Jun' value='960' color='D64646'/&gt;&lt;set name='Jul' value='629' color='8E468E'/&gt;&lt;set name='Aug' value='622' color='588526'/&gt;&lt;set name='Sep' value='376' color='B3AA00'/&gt;&lt;set name='Oct' value='494' color='008ED6'/&gt;&lt;set name='Nov' value='761' color='9D080D'/&gt;&lt;set name='Dec' value='960' color='A186BE'/&gt;&lt;/graph&gt;&quot;); 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; myChart.render(&quot;chartdiv&quot;); 
 &nbsp;&nbsp;&nbsp;&lt;/script&gt;
 &lt;/body&gt; 
 &lt;/html&gt; 
 </td>
 </tr>
 <tr> 
 <td valign="top" class="text">You can clearly see above, that instead of 
 using setDataURL method to provide the 
 path of XML file, here we've used setDataXML 
 method to provide the full XML data itself.
 When you now view the charts, you'll get the same output as before.</td>
 </tr>
 <tr> 
 <td valign="top" class="text">&nbsp;</td>
 </tr>
 <tr> 
 <td valign="top" class="highlightBlock">With this method, however, there can 
 sometimes be problems when you're working with larger chunks of data. This 
 problem happens due to the limitation on dataXML 
 string length imposed by the browser. When you specify a larger chunk of 
 data using dataXML method, the browser ignores 
 everything after a certain length. This causes FusionCharts to hang (nothing 
 would be displayed on-screen) as the full data has not been supplied to 
 it. Therefore, dataURL method is recommended 
 for larger chunks of data (basically - multi-series/combination charts).</td>
 </tr>
 <tr>
 <td valign="top" class="text">&nbsp;</td>
 </tr>
</table>
</body>
</html>