Zoom Line Chart With Linkedchart

[natg504]

1. Is it possible to create a zoom line chart and have it set up as a LinkedChart? I want to be able to click on a point in the zoom line chart, and then a separate chart below it will update. I can do this with a regular line chart, but I'd like to use a zoom line chart.

 

2. Also, I want to be able to pull the data from a database, rather than an xml file. I've tried using "myChart.setXMLData(strXML);" in place of "myChart.setXMLUrl("summary-data-all.xml");", but it is not loading any data.

 

<script type="text/javascript" src="includes/FusionCharts.js"></script>

<cfset strXML = "<chart showBorder='1' caption='Yearly Sales' xAxisName='Year' yAxisName='Sales'><categories><category label='2004' /><category label='2005' /><category label='2006' /><category label='2007' /></categories><dataset seriesName='Sales'><set value='37800' link='newchart-xml-2004-quarterly' /><set value='21900' link='newchart-xml-2005-quarterly' /><set value='32900' link='newchart-xml-2006-quarterly' /><set value='39800' link='newchart-xml-2007-quarterly' /></dataset><linkeddata id='2004-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2004'xAxisName='Quarter' yAxisName='Sales' ><set label='Q1' value='11700' /><set label='Q2' value='8600' /><set label='Q3' value='6900' /><set label='Q4' value='10600' /></chart></linkeddata><linkeddata id='2005-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2005'xAxisName='Quarter' yAxisName='Sales'><set label='Q1' value='5500' /><set label='Q2' value='7100' /><set label='Q3' value='3900' /><set label='Q4' value='5400' /></chart></linkeddata><linkeddata id='2006-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2006'xAxisName='Quarter' yAxisName='Sales'><set label='Q1' value='6700' /><set label='Q2' value='9200' /><set label='Q3' value='10800' /><set label='Q4' value='6200' /></chart></linkeddata><linkeddata id='2007-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2007'xAxisName='Quarter' yAxisName='Sales'> <set label='Q1' value='8900' /><set label='Q2' value='6600' /><set label='Q3' value='11200' /><set label='Q4' value='13100' /></chart></linkeddata></chart>"/>

<div id="chartContainer">FusionCharts will load here</div>

<div id="linkedchart-container" ><em>LinkedCharts</em> will load here</div>

<script type="text/javascript"><!--

var myChart = new FusionCharts( "includes/ZoomLine.swf", "myChartId", "400", "300", "0", "1" );
myChart.setXMLData(strXML);
myChart.render("chartContainer");

FusionCharts("myChartId").configureLink ({
swfUrl : "includes/Pie3D.swf",
renderAt : "linkedchart-container",
overlayButton: {show : false }
});

// -->
</script>

Edited April 1, 2011 by natg504

[natg504]

I've figured out the second question, but I still would like to know how to link a zoom line chart.

 

<script type="text/javascript" src="includes/FusionCharts.js"></script>

<cfset strXML = "<chart showBorder='1' caption='Yearly Sales' xAxisName='Year' yAxisName='Sales'><categories><category label='2004' /><category label='2005' /><category label='2006' /><category label='2007' /></categories><dataset seriesName='Sales'><set value='37800' link='newchart-xml-2004-quarterly' /><set value='21900' link='newchart-xml-2005-quarterly' /><set value='32900' link='newchart-xml-2006-quarterly' /><set value='39800' link='newchart-xml-2007-quarterly' /></dataset><linkeddata id='2004-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2004'xAxisName='Quarter' yAxisName='Sales' ><set label='Q1' value='11700' /><set label='Q2' value='8600' /><set label='Q3' value='6900' /><set label='Q4' value='10600' /></chart></linkeddata><linkeddata id='2005-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2005'xAxisName='Quarter' yAxisName='Sales'><set label='Q1' value='5500' /><set label='Q2' value='7100' /><set label='Q3' value='3900' /><set label='Q4' value='5400' /></chart></linkeddata><linkeddata id='2006-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2006'xAxisName='Quarter' yAxisName='Sales'><set label='Q1' value='6700' /><set label='Q2' value='9200' /><set label='Q3' value='10800' /><set label='Q4' value='6200' /></chart></linkeddata><linkeddata id='2007-quarterly'><chart showBorder='1' caption='Quarterly Sales Summary' subcaption='For the year 2007'xAxisName='Quarter' yAxisName='Sales'> <set label='Q1' value='8900' /><set label='Q2' value='6600' /><set label='Q3' value='11200' /><set label='Q4' value='13100' /></chart></linkeddata></chart>"/>

<div id="chartContainer">FusionCharts will load here</div>

<div id="linkedchart-container" ><em>LinkedCharts</em> will load here</div>

<script type="text/javascript"><!--
      <cfoutput>var #toScript(strXML, "strXML")#;</cfoutput>

var myChart = new FusionCharts( "includes/ZoomLine.swf", "myChartId", "400", "300", "0", "1" );
myChart.setXMLData(strXML);
myChart.render("chartContainer");

FusionCharts("myChartId").configureLink ({
swfUrl : "includes/Pie3D.swf",
renderAt : "linkedchart-container",
overlayButton: {show : false }
});

// -->
</script>

[Guest Angie]

Hi,

 

I am afraid, Zoom Line chart does not support the feature you are looking for, at this time.

 

We have taken a note of your request here and added the same in our wishlist.

 

We will try to implement this feature in our future upgrades.

 

Thank you very much for your continued patience and patronage.

 

Hope you have a great day!