Download PNG on button click
Created using FusionCharts Suite XT - www.fusioncharts.com
HTML
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
<!-- Exporting/downloading charts in different formats using FusionCharts Export chart feature. Clicking on the top right button opens the options to choose from. # exportEnabled - set to 1. Setting this attribute to 1 shows a button at top right corner of the chart canvas and lets user to choose exporting the chart to images/PDFs. -->
<div id="chart-container">FusionCharts will render here</div>
<div id='controllers' style='position:relative;text-align:center'>
<input id='exportpdf' type='Button' value='Download' /> </div>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Expires" content="-1"/>
<style type='text/css'>
.rn_ScreenReaderOnly{position:absolute; height:1px; left:-10000px; overflow:hidden; top:auto; width:1px;}
.rn_Hidden{display:none;}
</style>
<base href='http://walmartjump--tst1.custhelp.com/euf/rightnow/optimized/1417691890/themes/standard/'></base>
<style type="text/css"></style>
</head>
JavaScript
FusionCharts.ready(function(){
var dataSource = {
"chart": {
"caption": "Website visits",
"subcaption": "Purchase - Conversion analysis for last year",
"exportEnabled":"1",
"plotTooltext": "Success : $percentOfPrevValue",
"theme": "fint"
},
"data": [
{
"label": "Unique Website Visits",
"value": "1460000"
},
{
"label": "Programme Details Section Visits",
"value": "930000"
},
{
"label": "Attempts to Register",
"value": "540000"
},
{
"label": "Successful Registrations",
"value": "210000"
},
{
"label": "Logged In",
"value": "190000"
},
{
"label": "Purchased on Introductory Offers",
"value": "120000"
}
]
};
FusionCharts.options.SVGDefinitionURL='absolute';
var revenueChart = new FusionCharts({
"type": "pie2d",
"renderAt": "chart-container",
"width": "500",
"height": "300",
"dataFormat": "json",
"dataSource": dataSource
});
revenueChart.render();
});