I am trying to create a graph from a CSV file that contains multiple data values for each time value. I would like to graph two of those data points, but have not been able to figure out how to import the CSV file into an array.
Here is a sample of my 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
I would like to graph kWh and Savings on the y-axis and the Time along the x-axis. Any help would be appreciated. I am using the standard code for importing a CSV file for Highcharts, but am sure I need to change it somehow. Thanks!
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);
}
});
You need to write your own parser. Here is simple example how could this look like:
And jsfiddle: http://jsfiddle.net/3bQne/36/