Exporting charts and maps as an image or PDF – Tutorial | amCharts

  1. Home
  2. map design tutorials
  3. Exporting charts and maps as an image or PDF – Tutorial | amCharts

Since V 3.2.0 of our charts and V 3.7.0 of maps you can give your charts a way to escape out your browser and be a part of your file system. We added a possibility to export charts as an image. This works on all modern browsers except IE9 (works fine with IE10). You are only two steps away from this feature in it’s raw nature*. Yes, quite a few, but if you are worried about the number of requests to your server and file size, you can minify these files and compile them into one file. We haven’t done this, as in different scenarios you might not need all the files or two more files might be required. You can simply use Google’s closure compiler (or any other tool) to minify and compile all the files into one piece. Now, id you open your chart page with your browser (note, you should do it from your web server, not directly from hard drive), you should see download icon on bottom-right corner of your chart. If you click the icon, your browser should offer to save amChart.png image. You can easily adjust position, colors of the download image, also add two more possibilities – save chart as JPG or SVG. Saving to SVG has some issues which are not yet solved – it will offer to save separate SVG for the chart and legend (if the chart has it) and in case you do it with Stock chart, each panel and each legend will be saved in a separate SVG. Below is an example of amExport with all properties you can modify and all three file formats added: In case you don’t need your browser to offer saving the file, you can not to include filesaver.js. In this case the image will be opened in a new window/tab. But be careful – most browsers block popup windows now. You can also offer your chart viewers saving the charts as PDF. To do this, you’ll need these two additional js files: That’s it – the export to PDF option will appear in the drop-down menu when you’ll hover the export icon. If you need to change the orientation of the PDF paper you need to overwrite the “click” handler to pass the argument to the PDF instance: In case you don’t want the export button to be visible and need to trigger exporting from outside, you should simply pass the empty menuItems array to the config: This is it. We’d like to thank all the guys who created all the additional scripts we use here – you did a great job! Source.

whatsapp button