I've based my code on one of the examples provided to dynamically change the graph based on user input. When I hit the calculate buttn the graph is redisplayed but the XML hasn't changed. Why would this be?
[head]
[script language=JavaScript" src="../FusionCharts/FusionCharts.js][/script]
[sCRIPT LANGUAGE=JavaScript]
//Flag indicating whether our chart has loaded
var chartLoaded = false;
function FC_Rendered(domId){
//It is in this method that you can update chart's data using JS methods.
//Check if this is the chart that we want to update
if (domId=="chart1Id"){
//Yes - it is.
//Enable the form now, as the chart has loaded
this.document.interestCalculator.disabled = false;
//Set chartLoaded flag to true
chartLoaded = true;
//Get reference to chart object using Dom ID
var chartObj = getChartFromId(domId);
//Update it's XML - set animate Flag to true
chartObj.setDataXML(generateXML());
}
return true;
}
function updateChart(domId){
//Update only if chart has loaded
//this.document.write("chartLoaded" + chartLoaded);
if (chartLoaded){
//Get reference to chart object using Dom ID
var chartObj = getChartFromId(domId);
//Update it's XML
chartObj.setDataXML(generateXML());
}
}
function generateXML(){
//Variable to store XML
var strXML;
strXML = "[chart rotateValues=1' placeValuesInside='1' showYAxisValues='0' showLegend='0' useRoundEdges='1' formatnumberscale='0' caption='Interest Saving' decimalprecision='0' palette='2]";
strXML = strXML + "[categories] [category label='Interest over life of loan' /][/categories]";
//Based on the products for which we've to generate data, generate XML
//strXML = strXML + "[dataset SeriesName=Current][set value='" + calculateInterest(this.document.interestCalculator.LoanAmount.Value, this.document.interestCalculator.CurrentRate.Value) + "' /][/dataset]";
//strXML = strXML + "[dataset SeriesName=Desired][set value='" + calculateInterest(this.document.interestCalculator.LoanAmount.Value, this.document.interestCalculator.NewRate.Value) + "' /][/dataset][/chart]";
strXML = strXML + "[dataset SeriesName=Current' Color='FF0000][set value='2000' /][/dataset]";
strXML = strXML + "[dataset SeriesName=Desired' Color='0000FF][set value='1000' /][/dataset]";
//Close [chart] element;
strXML = strXML + "[/chart]";
//Return data
return strXML;
}
function calculateInterest (loanAmount, rate)
{
var interestXML;
interestXML = (loanAmount * (360 / (1 - (1 + Math.pow((rate/1200), -360)))) * 360 - loanAmount;
//Return
return "1000";//interestXML;
}
[/sCRIPT]
[/head]
[body bgcolor=#ffffff]
[FORM NAME='interestCalculator' Id='interestCalculator' action='Chart.html' method='POST' disabled]
Please select the products for which you want to plot the chart:
[iNPUT TYPE=Text' name='LoanAmount]Loan Amount
[iNPUT TYPE=Text' name='CurrentRate]Current Rate
[iNPUT TYPE=Text' name='NewRate]New Rate
[bUTTON NAME=submit onclick=updateChart('chart1Id')]Calculate[/bUTTON]
[/FORM]
[!-- Start Code for FusionCharts chart --]
[div id=chartdiv" align="center]FusionCharts[/div]
[script type=text/javascript]
var myChart = new FusionCharts("../FusionCharts/MSColumn3D.swf", "chart1Id", "450", "300", "1", "1");
[!-- myChart.setDataURL("Data.xml"); --]
myChart.setDataXML("[chart rotateValues=1' placeValuesInside='1' showYAxisValues='0' showLegend='0' useRoundEdges='1' yAxisMaxValue='10000' formatnumberscale='0' caption='Interest Saving' numberprefix='$' decimalprecision='0' palette='2' showvalues='0] [categories] [category label='Interest over life of loan' /][/categories][dataset SeriesName=Current' Color='FF0000][set value='0' /][/dataset][dataset SeriesName=Desired' Color='0000FF][set value='0' /][/dataset][/chart]");
myChart.render("chartdiv");
[/script]
[!-- End Code for FusionCharts chart --]
[/body]
[/html]
