save multiple charts to image with iframe, javascript function call doesn't work in firefox.

farwest · September 2, 2008

Hi,

I met a problem with saving multiple charts to image and then generate a pdf with the images. I put each of the charts into one iframe, and then when the user clicks on the generate pdf button, a javascript function try to call another javascript function (saveChart) in each of iframe page. (please see the codes below)

the problem is, it works fine with IE, but it doesn't work with firefox at all. I googled a lot and tried a lot diff things, but no luck with it. Anybody here get a idea what's wrong with it? Any input will be appreciated!

Regards,

Joe

-------------------------------------------------------------------------------

main page

< html>

< head>

< script language="JavaScript" type="text/javascript">

function saveCharts(){

top.iframe1.saveChart();

top.iframe2.saveChart();

top.iframe3.saveChart();

top.iframe4.saveChart();

top.iframe5.saveChart();

setTimeout('history.go(-1);', 9*1000 );

setTimeout('history.go(-1);', 9*1001 );

setTimeout('history.go(-1);', 9*1002 );

setTimeout('history.go(-1);', 9*1003 );

}

< /script>

< /head>

< iframe name="iframe1" id="iframe1" src ="fusionChart1.jsp" width="470px" height="250px">

< /iframe>

< iframe name="iframe2" id="iframe2" src ="fusionChart2.jsp" width="470px" height="250px">

< /iframe>

< iframe name="iframe3" id="iframe3" src ="fusionChart3.jsp" width="470px" height="250px">

< /iframe>

< iframe name="iframe4" id="iframe4" src ="fusionChart4.jsp" width="470px" height="250px">

< /iframe>

< iframe name="iframe5" id="iframe5" src ="fusionChart5.jsp" width="470px" height="250px">

< /iframe>

< a href="# " onclick="javascript:saveCharts();">DownLoad PDF< /a>

< /form>

< /body>

< /html>

-----------------------------------------------------------------------------------------------------

iframe page (fusionChart1.jsp ... fusionChart5.jsp)

< html>

< head>

< script language="JavaScript" type="text/javascript"

src="https://localhost:8443/bmw/js/FusionCharts.js">

< /script>

< script language="JavaScript" type="text/javascript">

function saveChart(){

var chartToPrint;

chartToPrint = getChartFromId('001');

chartToPrint.saveAsImage();

}

< /script>

< /head>

< body bgcolor="#ffffff">

< form action="" method="post">

< object classid="01" codebase="https://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="420" height="190" id="001" >

< param name="movie" value="../../charts/Scatter.swf" />

< param name="FlashVars" value="&registerWithJS=1&dataURL=../../charts/data_XYScatter.xml">

< param name="quality" value="high" />

< embed src="../../charts/Scatter.swf" flashVars="&registerWithJS=1&dataURL=../../charts/data_XYScatter.xml" quality="high" width="420" height="190" name="Column3D" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />

< /object>

< /form>

< /body>

< /html>

FusionCharts Support · September 3, 2008

Hi,

Could you please tell why you are using the setTimeout()?

farwest · September 3, 2008

Sudipto Choudhury (9/3/2008)
Hi,

Could you please tell why you are using the setTimeout()?

The history.go(-1), will re-render the chart in each of the iframe. The reason of using setTimeout() is to wait for the process of sending raw image data to server to be finished. Otherwise, the browser will go back to the previous page before the expected server response reaches client.

Actually, the question is, in firefox, can we call saveAsImage() function for the chart in each iframe through a JavaScript function reside in the parent frame. Please see the attached image for a illustration.

In the attached webpage, after the user clicks on "Download PDF", a javascript function in the parent frame will be triggered to call "saveAsImage()" for each of the charts starting from iframe1 to iframe5. At the server side, the program will cache the first 4 images and generate a pdf report after received the 5th image. and then send the pdf to client.

It works fine with IE, but fails in firefox (tested on 1.5.x, 2.0.x, and 3.0.x)

Thanks!

Rahul Kumar · September 4, 2008

Hi,

Could you please let us know why are you using <object classid="01" ...> ? It should be exactly like <object classid="clsid: D27CDB6E-AE6D-11cf-96B8-444553540000" ...> because it is the Class ID of Flash Player & IE recognize embedded object by its Class ID.

Another problem is you have missed out to give id="001" ... id="005" in embed tag due to this FireFox could not handle the request as it is unable the find the embeded object in the iframes HTML page.

Please replace your code with the following code in all iframe(x).html files:

</object>

You can use the following code to loop through the iframes:

for (var i=0;i<top.frames.length;i++)

{

top.frames.saveChart();

}

NOTE: Please remove the space between : and D in classid="clsid: D27...

Edited September 4, 2008 by Guest

farwest · September 4, 2008

Hi Rahul,

Thank you very much for the reply!! And the forgetting put the id in the embed tag is the reason for this.

Best regards,

Joe

sachin257 · January 28, 2009

Hi,

I AM GETTING "Error in loading data" for the below code.

Please help me.

==========================================================================================

<html>

<head>

function saveChart()

{

varchartToPrint;

chartToPrint=getChartFromId('001');

chartToPrint.saveAsImage();

}

</script>

</head>

</object>

for (var i=0;i<top.frames.length;i++)

{

top.frames.saveChart();

}

%>

</script>

</form>

</body>

</html>

==========================================================================================

Regds,

Sachin.H

Rahul Kumar · January 29, 2009

Hi Sachin,

Please see the code below:

27CDB6E-AE6D-11cf-96B8-444553540000" codebase="https://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="420" height="190" id="001" >

http://www.macromedia.com/go/getflashplayer" />

</object>

In the above code, double quotes are not required.

It should be like the following:

27CDB6E-AE6D-11cf-96B8-444553540000" codebase="https://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="420" height="190" id="001" >

http://www.macromedia.com/go/getflashplayer" />

</object>

Edited January 29, 2009 by Guest

Sign In

save multiple charts to image with iframe, javascript function call doesn't work in firefox.

Recommended Posts

farwest

Share this post

Link to post

Share on other sites

FusionCharts Support

Share this post

Link to post

Share on other sites

farwest

Share this post

Link to post

Share on other sites

Rahul Kumar

Share this post

Link to post

Share on other sites

farwest

Share this post

Link to post

Share on other sites

sachin257

Share this post

Link to post

Share on other sites

Rahul Kumar

Share this post

Link to post

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity