2013-02-11 47 views
3

我想从包含每个时间值的多个数据值的CSV文件创建一个图表。我想绘制其中的两个数据点,但一直未能弄清楚如何将CSV文件导入到数组中。如何选择CSV中的哪些列与HighChart进行统计?

这里是我的CSV

Year,Month,Day,Hour,Time,kWh,Savings,Total kWh 
2013,02,06,11,11:00,0,0,308135 
2013,02,06,11,11:59,15,1.875,308150 
2013,02,06,12,12:59,27,3.375,308177 
2013,02,06,13,13:59,34,4.25,308211 
2013,02,06,14,14:59,32,4,308243 

的样本,我想图表千瓦时储蓄在y轴和沿x轴的时间。任何帮助,将不胜感激。我正在使用标准代码导入Highcharts的CSV文件,但我确定需要以某种方式更改它。谢谢!

var options = { 
     chart: { 
      renderTo: 'container', 
      defaultSeriesType: 'column' 
     }, 
     title: { 
      text: 'Wind Turbine Hourly Production' 
     }, 
     xAxis: { 
      categories: [] 
     }, 
     yAxis: { 
      title: { 
       text: 'kWh' 
      } 
     }, 
     series: [] 
    }; 

    /* 
    Load the data from the CSV file. This is the contents of the file: 

     Apples,Pears,Oranges,Bananas,Plums 
     John,8,4,6,5 
     Jane,3,4,2,3 
     Joe,86,76,79,77 
     Janet,3,16,13,15 

    */ 
    $.get('medford-hour.csv', function(data) { 
     // Split the lines 
     var lines = data.split('\n'); 
     $.each(lines, function(lineNo, line) { 
      var items = line.split(','); 

      // header line containes categories 
      if (lineNo == 0) { 
       $.each(items, function(itemNo, item) { 
        if (itemNo > 0) options.xAxis.categories.push(item); 
       }); 
      } 

      // the rest of the lines contain data with their name in the first position 
      else { 
       var series = { 
        data: [] 
       }; 
       $.each(items, function(itemNo, item) { 
        if (itemNo == 0) { 
         series.name = item; 
        } else { 
         series.data.push(parseFloat(item)); 
        } 
       }); 

       options.series.push(series); 

      } 

     }); 

回答

1

您需要编写自己的解析器。下面是简单的例子,这怎么可能是这样的:

var lines = data.split('\n'); 
$.each(lines, function (lineNo, line) { 
    var items = line.split(','); 
    if(lineNo !== 0) { 
     var x = + new Date(items[1]+'/'+items[2]+'/'+items[0]+' '+items[4]), 
      kwh = parseFloat(items[5]), 
      savings = parseFloat(items[6]); 
     if(!isNaN(kwh) && !isNaN(savings)){ 
      options.series[0].data.push([x,kwh]); 
      options.series[1].data.push([x,savings]) 
     } 
    } 
} 

而且的jsfiddle:http://jsfiddle.net/3bQne/36/