WebRoot/FusionChartsFree/Contents/ASP_JS_XML.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<?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">Combining FusionCharts, ASP &amp; JavaScript (dataXML) 
						method
					</h2>				</td>
			</tr>
			<tr>
				<td valign="top" class="text"><p>In this example, we will see how to <strong> provide updated XML data to chart using JavaScript </strong>
					functions. The chart will simply accept that XML data and then render.					</p>
					<p class="highlightBlock">This method can effectively be used in your AJAX 
						applications, where your JavaScript code gets the updated XML from server and 
						then provides it to charts locally. You can process the data received from AJAX 
						Calls, build XML from it and finally provide it to the chart.					</p>
					<p><strong>Before you proceed with the contents in this page, we strictly recommend you 
							to please go through the sections &quot;How FusionCharts works?&quot; and 
							&quot;<a href="ASP_DB.html">Plotting from Database  Example</a>&quot;, as we'll directly use a lot of concepts defined in 
							those sections.</strong></p>
					<p class="highlightBlock">The code discussed in this example is present in<span class="codeInline"> Download Package &gt; Code &gt; ASP &gt; DB_JS </span>folder.					</p>				</td>
			</tr>
			<tr>
				<td valign="top" class="text">&nbsp;</td>
			</tr>
			<tr>
				<td valign="top" class="header">Defining the applicaton				</td>
			</tr>
			<tr>
				<td valign="top" class="text"><p>Let us first define what we want to achieve in this example. We'll carry on   from our previous drill-down example and convert it into a single page example.   In our previous example, we were showing the Production Summary of all the   factories in a pie chart. When the user clicked on a pie slice, he was taken to   another page, where a detailed date-wise chart was shown for the required   factory. </p>
					<p>In this example we will put both the charts together on a single page where clicking on a pie slice of the Production Summary chart will open the detailed chart on the same page without page refresh.</p>
					<ol>
						<li>
							Contain both the pie chart (summary) and column chart (detailed) in one page (<span class="codeInline">Default.asp</span>).</li>
						<li>
							When the page loads, the pie chart would use
							<span class="codeInline">dataXML</span>
							method to show summary of all factories. This data will be built in
							<span class="codeInline">Default.asp</span>
							itself.						</li>
						<li>
							There will be a JavaScript array named as
							<span class="codeInline">data</span>
							in this page. This array will contain detailed data for the factories. The 
							array will be dynamically built using ASP and then outputted as JavaScript 
							code.						</li>
						<li>
							Apart from the data in JavaScript, we'll also have a local JavaScript function
							<span class="codeInline">updateChart()</span>, which would process the data in 
							this array and convert it to XML data document, for direct usage by the column 
							chart.						</li>
						<li>
							The column chart would initialize with no data, as the user has not selected a 
							factory initially. We'll customize the &quot;<span class="codeInline">No data to display</span>&quot;