0

I need to convert jquery chart into csv file. can you please help me with the function. I all ready have the graphs but i could not find the function to convert my graph into csv and download it. Actually i found this option right here :

http://flotr.googlecode.com/svn/trunk/flotr/examples/prototype/data-download.html

but there is no code for that. Thanks

Loubna H
  • 15
  • 7

1 Answers1

0

Just looked in the source of the page and got you the function that is doing the magic there. May it helps you -

   /**
   * Converts the data into CSV in order to download a file
   */

  downloadCSV: function(){
    var i, csv = '',
        series = this.series,
        options = this.options,
        dg = this.loadDataGrid(),
        separator = encodeURIComponent(options.spreadsheet.csvFileSeparator);

    if (options.spreadsheet.decimalSeparator === options.spreadsheet.csvFileSeparator) {
      throw "The decimal separator is the same as the column separator ("+options.spreadsheet.decimalSeparator+")";
    }

    // The first row
    for (i = 0; i < series.length; ++i) {
      csv += separator+'"'+(series[i].label || String.fromCharCode(65+i)).replace(/\"/g, '\\"')+'"';
    }
    csv += "%0D%0A"; // \r\n

    // For each row
    for (i = 0; i < dg.length; ++i) {
      var rowLabel = '';
      // The first column
      if (options.xaxis.ticks) {
        var tick = options.xaxis.ticks.find(function(x){return x[0] == dg[i][0]});
        if (tick) rowLabel = tick[1];
      }
      else if (options.spreadsheet.tickFormatter){
        rowLabel = options.spreadsheet.tickFormatter(dg[i][0]);
      }
      else {
        rowLabel = options.xaxis.tickFormatter(dg[i][0]);
      }
      rowLabel = '"'+(rowLabel+'').replace(/\"/g, '\\"')+'"';
      var numbers = dg[i].slice(1).join(separator);
      if (options.spreadsheet.decimalSeparator !== '.') {
        numbers = numbers.replace(/\./g, options.spreadsheet.decimalSeparator);
      }
      csv += rowLabel+separator+numbers+"%0D%0A"; // \t and \r\n
    }
    if (Prototype.Browser.IE && !Flotr.isIE9) {
      csv = csv.replace(new RegExp(separator, 'g'), decodeURIComponent(separator)).replace(/%0A/g, '\n').replace(/%0D/g, '\r');
      window.open().document.write(csv);
    }
    else window.open('data:text/csv,'+csv);
  }
});

If you have problems with this code here's a link to the whole source - Flotr

You could also get the Table with the class "flotr-datagrid" and convert it in JavaScript (HowTo) or send it via PostBack to your asp server and do the magic serverside via C#.

Community
  • 1
  • 1
Mx.
  • 3,588
  • 2
  • 25
  • 33
  • Tkx , Actually i looked in the source of the page using "google chrome" but i didnt find !! – Loubna H Jul 23 '13 at 10:39
  • Its quite hard when you are new to it - here's the way i found it: 1 - selected the button for .csv downloading, no onclick so the event must be set in code 2 - got the class because it is the only selector for the button 3 - searched for it in ressources tab (cntrl + f) – Mx. Jul 23 '13 at 10:45
  • tks so mush , it really helps me :) – Loubna H Jul 23 '13 at 12:37