Exports

Overview

AnyChart provides you with ability to export charts to images (SVG, PNG, JPG), PDF or data files (CSV, Excel). These options are available both via Context menu and API. Every export has some fine tune options, including an ability to change file name. There is also a special option to save chart configuration which may be used to debug charts and report issues.

Export server

IMPORTANT, DO NOT SKIP THIS PART

AnyChart "save as" features work via AnyChart Export Server, which is hosted at AnyChart.Com server. Although we do our best to keep AnyChart site up and running 24x7x365 - we do not guarantee export server availability. If you want to have full control over the ability of the component to export images, or just don't want to use AnyChart Server due to the security or accessibility concerns - just run Export Server in server mode on the server you control and trust and configure your charts to custom_server.

Custom server address is set using the anychart.exports.server() method:

anychart.exports.server("http://localhost:2000");

You can read all about AnyChart Export Server and Server-side rendering in AnyChart Export Server article.

File name

If you want to change default file name for all exports at once you can use anychart.exports.filename() method:

anychart.exports.filename('custom_name');

After you do so, all files, images, pdf and data, will be saved under this name, unless you override it when calling specific methods or for the specific chart. To set how a specific chart should be named when exporting set:

chart.exports.filename('custom_name');

Image

AnyChart js charting library allows to save charts in 3 different image formats: SVG, PNG and JPG:

SVG

saveAsSvg() can be launched in two modes, one with width and height passed:

saveAsSvg({"width": 360, "height": 500, "filename": 'My Chart SVG'})

And another one with paper size and page orientation set:

saveAsSvg({"paperSize": "A4", "landscape": false, "filename": "My Chart SVG"});  

PNG

With saveAsPng() you can set width, height and quality in addition to file name:

saveAsPng({"width": 360, "height": 500, "quality": 0.3, "filename": "My Chart PNG"});

JPG

With saveAsJpg() you can set width, height, quality and forceTransparentWhite flag and in addition to file name:

saveAsJpg({"width": 360, "height": 500, "quality": 0.3, "forceTransparentWhite": false, "filename": "My Chart JPG"});

To launch the export you need to use these methods as shown:

// save the chart in SVG format
chart.saveAsSvg();
// save the chart in PNG format
chart.saveAsPng();
// save the chart in JPG format
chart.saveAsJpg();

And here is a sample where you can see all methods in action:

JsFiddle Playground

PDF

To save chart in Pdf format use: saveAsPdf method:

// initiate saving chart in PDF format
chart.saveAsPdf();

JsFiddle Playground

Data

AnyChart provides several methods for saving current chart's data. Output formats are CSV and saveAsXlsx() (Excel file).

ChartDataExportMode parameter defines what data is exported: only the data used by chart (SPECIFIC), all data in the data set (RAW) and a special mode for stock charts allows to export grouped data (GROUPED).

CSV

With saveAsCsv() you can set how you export data and file name:

saveAsCsv("raw", {"rowsSeparator": "\n", "columnsSeparator": ","}, filename: "csv_file");

CSV has several export modes that depend on chart type, see anychart.enums.ChartDataExportMode to learn more.

Excel

With saveAsXlsx() you can set how you export data and file name:

// initiate saving chart's data in Xlsx format
chart.saveAsXlsx('default', "excel");

Excel has several export modes that depend on chart type, see anychart.enums.ChartDataExportMode to learn more.

To launch the export you need to use these methods as shown:

// initiate saving chart's data in Xlsx format
chart.saveAsXlsx();
// initiate saving chart's data in CSV format
chart.saveAsCsv();

JsFiddle Playground

Chart Configuration

Chart config may be saved using XML and JSON methods, this feature may be very useful in debug process or if you want to create some kind of import/export functionality for chart themselves. These methods get output of toJson() and toXml() methods and allow to save it as file. First parameter is boolean flag that defines if the current Theme is included in output configuration file.

XML

// save chart data and configuration in XML format
chart.saveAsXml("chart_xml", false);

JSON

// save chart data and configuration in Json format
chart.saveAsJson("json_config", false);

Here is a sample of chart save as XML and save as JSON methods:

JsFiddle Playground