Free Trial

Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.

  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

5. Exporting Charts > Time for action — create separate buttons to export the c...

Time for action — create separate buttons to export the chart as image and PDF

Time for action — create separate buttons to export the chart as image and PDF Create a copy of ExportUsingJavaScriptAPI.html and save it as ExportUsingJavaScriptAPI2.htmlOpen this file in a text editor and replace the entire beginExportChart function with the following modified variant: function beginChartExport (format) { if(chartObj.hasRendered && chartObj.hasRendered()) { chartObj.exportChart({ exportFormat: format }); document.getElementById("exporterContainer").innerHTML = ""; } else { alert("Please wait for the chart to render."); } } Locate the HTML button to export the chart (around line 51) and replace it with the following code, having two buttons: <input type="button" value="Export Chart as Image" onclick="beginChartExport('PNG')" /> <input type="button" value="Export Chart as PDF" onclick="beginChartExport('PDF')" /> Open the file in a web browser, click on the first button labeled Export Chart as Image, and let the export process complete. On completion of the export process, click on the Save Report button and notice that the file being saved, SuperMart Report.png, is an image file. You may save the file and open it using an image viewer to verify this.Now click on the button labeled Export Chart as PDF and the same export process will begin.On completion of the second export process, again click on the Save Report button and notice that this time the file being saved, SuperMart Report.pdf, is a PDF document. You may save the file and open it using a PDF document viewer to verify this. What just happened? To customize the export format, we tweaked our beginChartExport function to accept the export format as a parameter. We then went on to replace the single export button with two separate buttons that passed on the format in which the chart has to be exported. The exportChart function of the chart accepts a parameter that allows us to provide export-related configurations to the chart for that particular call. Thus, even when the data of the chart explicitly states certain export-related configurations, the same can be overridden via the exportChart function. For example, if a chart has the attributes,<chart ... exportAtClient="1" exportFileName="My exported chart" ...>, the same can be easily ignored and overridden by calling chartObject.exportChart({ exportAtClient: "0", exportFileName="My new file name" });. These configurations are temporary and are applicable only for the export call in which they were passed. If the context menu is used, the chart will again revert to the configuration passed on to it by the chart data. For our beginChartExport function, we provided the export format by passing on the exportFormat attribute as'PNG' and'PDF' depending upon which button was clicked. There are seven other parameters, listed in the following table, which can be passed to further customize export calls:


If a chart has already been exported, then initiating a second export with the previous export component still being visible might create confusion. Hence, with the beginChartExport function, we deleted the contents of the export component container by executing document.getElementById("exporterContainer").innerHTML = "";. The export component will get rendered again as the chart will again fire the exportReady event upon the completion of the second export call. Pop quiz — JavaScript Export API Which chart function will you call to initiate the export process?Which XML/JSON chart attribute would you use to configure the filename of the exported chart?What is the name of the simple chart event that is raised when a chart completes capturing itself?

  

You are currently reading a PREVIEW of this book.

                                                                                                                    

Get instant access to over $1 million worth of books and videos.

  

Start a Free Trial


  
  • Safari Books Online
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint