Exporting chart to image

Any chart or map can be exported to image, PDF or data formats. For that you'll need to enable our Export plugin, which is bundled with every amCharts product. Roll-over the download icon in top-right corner of the chart - you will see several download options. Export plugin generates images and other data completely in browser and does not rely on server. The only downside of this is that this is supported by modern browsers only and IE10+ (not IE9). For more information and documentation on how to enable export features in your charts, check <a href="https://www.amcharts.com/kbase/intro-exporting-charts/">this exporting tutorial</a>. For advanced usage, such as generating export of multiple charts at once, or saving images on server, check <a href="https://www.amcharts.com/kbase/export-charts-advanced/">this tutorial</a>.

HTML

<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
<script src="https://www.amcharts.com/lib/3/pie.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<div id="chartdiv"></div>

CSS

#chartdiv {
  width: 100%;
  height: 500px;
}

JavaScript

AmCharts.makeChart("chartdiv", {
               "type": "pie",
               "theme": "light",
               "labelRadius": -35,
               "labelText": "[[percents]]%",		   
               "dataProvider": [ {
                 "country": "Used Space",			
    			 "fillColor":"#0000ff",
                 "litres": 84
               },
    		   {
    		   "country": "Free Space",		   
    		    "color":"#33cc33",
                 "litres": 16
    			 }],
               "valueField": "litres",
               "titleField": "country",
    		   "outlineAlpha": 0.4,
    		   "depth3D": 12,
    		   "outerRadius":35,
    		   "angle": 40,
    		   "labelsEnabled": false,
    		   "autoMargins": false,
      "marginTop": 0,
      "marginBottom": 0,
      "marginLeft": 8,
      "marginRight": 8,
      "pullOutRadius": 0,
    
                "balloon":{
                "fixedPosition":true
               },
               "export": {
                 "enabled": true,
             	menu:[]
               }
             } );
     
             
             
             // generate some random data, quite different range
             function generateChartData() {
                 var chartData = [];
             	
             	chartData = [{"date" : "09/11/2018 0:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 1:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 2:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 3:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 4:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 5:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 6:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 7:00", "diskSpaceUsage" : "84"},{"date" : "09/11/2018 8:00", "diskSpaceUsage" : "83.75"},
             	{"date" : "09/11/2018 9:00", "diskSpaceUsage" : "83"},{"date" : "09/11/2018 10:00", "diskSpaceUsage" : "83"},{"date" : "09/11/2018 11:00", "diskSpaceUsage" : "83"},{"date" : "09/11/2018 12:00", "diskSpaceUsage" : "83"},{"date" :...