export to the user an Excel or CSV of the raw data driving the chart? - Javascript highcharts

Javascript examples for highcharts:Chart Data

  1. HOME
  2. Javascript
  3. highcharts
  4. Chart Data

Description

export to the user an Excel or CSV of the raw data driving the chart?

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <title>Highcharts test tool</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-git.js"></script> 
      <style id="compiled-css" type="text/css">

#container {//w w w  .  j  a va 2s .  c o  m
   height: 300px;
   margin-top: 2em;
}
pre {
   border: 1px solid silver;
   border-radius: 0.5em;
   padding: 1em;
   color: green;
}


      </style> 
      <script type="text/javascript">
    $(function(){
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container'
    },
    title: {
        text: 'Categorized chart'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]
});
$('#preview').html(chart.getCSV());
    });

      </script> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <script src="https://code.highcharts.com/modules/exporting.js"></script> 
      <script src="https://highcharts.github.io/export-csv/export-csv.js"></script> 
      <div id="container"></div> 
      <h3>Exported CSV:</h3> 
      <pre id="preview"></pre>  
   </body>
</html>

Related Tutorials