macsig

chart.hasRendered is not a function

By macsig, in Javascript Problems

Recommended Posts

macsig   

macsig
Posted

Hello there I'm trying to export a Multi-Line chart through js but I get chart.hasRendered is not a function

 

From my understanding hasRendered comes with the swf file itself

 

 

 

("All the charts in the FusionCharts expose a number of APIs which allow you to print the chart, export the chart as image/PDF, get an attribute or the entire data of the chart and the like.

 

These APIs are not a part of FusionCharts.js, but built into the chart swfs themselves and as such, you do not need to include FusionCharts.js in your HTML code to make use of these APIs.")

 

 

 

Here my code (RoR app):

 

 

 


<% 	str_xml = render :file => 'annual_reports/data_chart', :locals => {:results => results }

render_chart '/FusionCharts/MSLine.swf','',str_xml,'chartID1', 807, 350, false, true do

end %>

 

 

 

The last parameter (set as true) is register_with_js that form my understanding enables the js APIs built into the swf.

 

 

 

So, I don't understand what I'm missing. Can anyone help me out?

 

 

 

Thanks, I appreciate.

 

 

 

 

 

PS The MSLine.swf I'm using has been downloaded few days ago from FusionCharts website so I suppose is the last version.

Share this post

Link to post
Share on other sites

Guest Madhumita   

Guest Madhumita
Posted

Hello,

 

 

 

When you reference the chart object by its ID, the chart should already have rendered. Otherwise it will raise this error.

 

 

 

Now, you can call chart = getChartFromId('chartId') when the FC_Rendered() event is fired and then do chart.hasRendered() or after the chart has rendered onClick of a button reference the chart object and similarly proceed.

 

ref. - http://www.fusioncharts.com/docs/Contents/JS_print.html

Share this post

Link to post
Share on other sites

macsig   

macsig
Posted (edited)

Hello,

 

sorry for my late reply but I have been abroad so I couldn't work on this project.

 

 

 

Below you may find my code:

 

 

 

 

 

 

 

 

function FC_Exported() {

 

alert("exported");

 

}

 

 

 

 

 

 

 

function exportCharts(exportType)

 

{

 

//Get reference to chart.

 

var chart = getChartFromId("chartID1");

 

 

 

// Now, we proceed with exporting only if chart has finished rendering.

 

if (chart.hasRendered() != true)

 

{

 

alert("Please wait for the chart to finish rendering, before you can invoke exporting");

 

return;

 

}

 

 

 

// call exporting function

 

chart.exportChart( {exportFormat: exportType} );

 

}

 

 

 

 

 

 

 

As you said I have onClick of a button reference the chart object but I get the same result: chart.hasRendered is not a function

 

 

 

 

 

Thanks

Edited by Guest

Share this post

Link to post
Share on other sites

macsig   

macsig
Posted

I have also tried something like (where exportButtonPNG is the button ID)

 

 

 

 

 

function FC_Rendered() {

 

$('#exportButtonPNG').bind("click", function() {

 

var chart = getChartFromId("chartID1");

 

chart.exportChart( {exportFormat: 'PNG'} );

 

});

 

}

 

 

 

but I still get the same error.

 

 

 

 

 

Any ideas?

 

 

 

 

 

Thanks

Share this post

Link to post
Share on other sites

whiplash159   

whiplash159
Posted (edited)

I have exactly the same problem. I use a very simple example which is very close to the given examples in the FusionCharts website:

 

 

 

The HTML file:

 

 

 

<html>

 

<head>

 

<title>My Chart</title>

 

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

 

 

 

<script type="text/javascript">

 

function ExportMyChart() {

 

var testObj = getChartFromId('myChartId');

 

if( testObj.hasRendered() ) testObj.exportChart();

 

}

 

</script>

 

</head>

 

 

 

<body>

 

<div id="chartContainerDiv">FusionCharts loaded here...</div>

 

<script type="text/javascript">

 

var myChart = new FusionCharts('Charts/Column3D.swf', 'myChartId', '900', '300', '0', '1');

 

myChart.setDataURL('Data.xml');

 

myChart.render('chartContainerDiv');

 

</script>

 

<input type="button" value="Export My Chart" onclick="ExportMyChart()" />

 

</body>

 

</html>

 

 

 

 

 

The XML file:

 

<chart chartTopMargin='40' caption='Month report' xAxisName='Attendance / Month' formatNumberScale='0' thousandSeparator=' ' chartLeftMargin='15' chartRightMargin='15' chartTopMargin='15' chartBottomMargin='15' rotateYAxisName='0' exportEnabled='1' exportHandler='ExportHandlers/PHP/FCExporter.php' exportAtClient='0' exportAction='download' >

 

>

 

<set label='12.2009' value='10000' />

 

<set label='01.2010' value='15000' />

 

<set label='02.2010' value='17500' />

 

<set label='03.2010' value='15000' />

 

<set label='04.2010' value='4000' />

 

</chart>

 

 

 

 

 

 

 

All files are loaded successfully. I see the chart, but when I click on the button I get js error that hasRendered is not a function.

 

I'm using the package available in the download section of the FusionCharts web site and I tested on Mozilla Firefox 3.6.3.

Edited by Guest

Share this post

Link to post
Share on other sites

FusionCharts Support   

FusionCharts Support
Posted

Hi,

 

 

 

To reiterate could you please check the following:

 

 

 

1. You have latest FusionCharts (v3.1.0 or more). Lower versions do not support this.

 

 

 

2. You are using code to check whether hasRendered is defined or not.

 

 

 

e.g.

 

 

 

 

 

function ExportMyChart() {

 

var testObj = getChartFromId('myChartId');

 

if( testObj.hasRendered && testObj.hasRendered() ) testObj.exportChart();

 

 

 

}

Share this post

Link to post
Share on other sites

whiplash159   

whiplash159
Posted
1. You have latest FusionCharts (v3.1.0 or more). Lower versions do not support this.

 

Yes, I have the latest Fusion Charts.

 

 

 

2. You are using code to check whether hasRendered is defined or not.

 

 

 

function ExportMyChart() {

 

var testObj = getChartFromId('myChartId');

 

if( testObj.hasRendered && testObj.hasRendered() ) testObj.exportChart();

 

 

 

}

 

It will not show an error with this but also it will not export the chart which is my main goal.

Share this post

Link to post
Share on other sites

macsig   

macsig
Posted
whiplash159 (5/31/2010)
I have exactly the same problem. I use a very simple example which is very close to the given examples in the FusionCharts website:

 

 

 

The HTML file:

 

 

 

<html>

 

<head>

 

<title>My Chart</title>

 

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

 

 

 

<script type="text/javascript">

 

function ExportMyChart() {

 

var testObj = getChartFromId('myChartId');

 

if( testObj.hasRendered() ) testObj.exportChart();

 

}

 

</script>

 

</head>

 

 

 

<body>

 

<div id="chartContainerDiv">FusionCharts loaded here...</div>

 

<script type="text/javascript">

 

var myChart = new FusionCharts('Charts/Column3D.swf', 'myChartId', '900', '300', '0', '1');

 

myChart.setDataURL('Data.xml');

 

myChart.render('chartContainerDiv');

 

</script>

 

<input type="button" value="Export My Chart" onclick="ExportMyChart()" />

 

</body>

 

</html>

 

 

 

 

 

The XML file:

 

<chart chartTopMargin='40' caption='Month report' xAxisName='Attendance / Month' formatNumberScale='0' thousandSeparator=' ' chartLeftMargin='15' chartRightMargin='15' chartTopMargin='15' chartBottomMargin='15' rotateYAxisName='0' exportEnabled='1' exportHandler='ExportHandlers/PHP/FCExporter.php' exportAtClient='0' exportAction='download' >

 

>

 

<set label='12.2009' value='10000' />

 

<set label='01.2010' value='15000' />

 

<set label='02.2010' value='17500' />

 

<set label='03.2010' value='15000' />

 

<set label='04.2010' value='4000' />

 

</chart>

 

 

 

 

 

 

 

All files are loaded successfully. I see the chart, but when I click on the button I get js error that hasRendered is not a function.

 

I'm using the package available in the download section of the FusionCharts web site and I tested on Mozilla Firefox 3.6.3.

 

 

 

 

Are you using other js libraries? I have solved this issue when I have removed some js libraries from my application.

 

 

 

 

 

HTH.

 

 

 

 

 

Sig

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Go To Topic Listing Javascript Problems