highcharts-rails 3.0.6 → 3.0.7

data/app/assets/javascripts/highcharts/modules/data.js

@@ -1,17 +1,582 @@
+/**
+ * @license Data plugin for Highcharts
+ *
+ * (c) 2012-2013 Torstein Hønsi
+ * Last revision 2013-06-07
+ *
+ * License: www.highcharts.com/license
+ */
+
 /*
- Data plugin for Highcharts
-
- (c) 2012-2013 Torstein Hønsi
- Last revision 2013-06-07
-
- License: www.highcharts.com/license
-*/
-(function(h){var k=h.each,m=function(b,a){this.init(b,a)};h.extend(m.prototype,{init:function(b,a){this.options=b;this.chartOptions=a;this.columns=b.columns||this.rowsToColumns(b.rows)||[];this.columns.length?this.dataFound():(this.parseCSV(),this.parseTable(),this.parseGoogleSpreadsheet())},getColumnDistribution:function(){var b=this.chartOptions,a=b&&b.chart&&b.chart.type,c=[];k(b&&b.series||[],function(b){c.push((h.seriesTypes[b.type||a||"line"].prototype.pointArrayMap||[0]).length)});this.valueCount=
-{global:(h.seriesTypes[a||"line"].prototype.pointArrayMap||[0]).length,individual:c}},dataFound:function(){this.parseTypes();this.findHeaderRow();this.parsed();this.complete()},parseCSV:function(){var b=this,a=this.options,c=a.csv,d=this.columns,f=a.startRow||0,i=a.endRow||Number.MAX_VALUE,j=a.startColumn||0,e=a.endColumn||Number.MAX_VALUE,g=0;c&&(c=c.replace(/\r\n/g,"\n").replace(/\r/g,"\n").split(a.lineDelimiter||"\n"),k(c,function(c,h){var n=b.trim(c),p=n.indexOf("#")===0;h>=f&&h<=i&&!p&&n!==""&&
-(n=c.split(a.itemDelimiter||","),k(n,function(b,a){a>=j&&a<=e&&(d[a-j]||(d[a-j]=[]),d[a-j][g]=b)}),g+=1)}),this.dataFound())},parseTable:function(){var b=this.options,a=b.table,c=this.columns,d=b.startRow||0,f=b.endRow||Number.MAX_VALUE,i=b.startColumn||0,j=b.endColumn||Number.MAX_VALUE,e;a&&(typeof a==="string"&&(a=document.getElementById(a)),k(a.getElementsByTagName("tr"),function(a,b){e=0;b>=d&&b<=f&&k(a.childNodes,function(a){if((a.tagName==="TD"||a.tagName==="TH")&&e>=i&&e<=j)c[e]||(c[e]=[]),
-c[e][b-d]=a.innerHTML,e+=1})}),this.dataFound())},parseGoogleSpreadsheet:function(){var b=this,a=this.options,c=a.googleSpreadsheetKey,d=this.columns,f=a.startRow||0,i=a.endRow||Number.MAX_VALUE,j=a.startColumn||0,e=a.endColumn||Number.MAX_VALUE,g,h;c&&jQuery.getJSON("https://spreadsheets.google.com/feeds/cells/"+c+"/"+(a.googleSpreadsheetWorksheet||"od6")+"/public/values?alt=json-in-script&callback=?",function(a){var a=a.feed.entry,c,k=a.length,m=0,o=0,l;for(l=0;l<k;l++)c=a[l],m=Math.max(m,c.gs$cell.col),
-o=Math.max(o,c.gs$cell.row);for(l=0;l<m;l++)if(l>=j&&l<=e)d[l-j]=[],d[l-j].length=Math.min(o,i-f);for(l=0;l<k;l++)if(c=a[l],g=c.gs$cell.row-1,h=c.gs$cell.col-1,h>=j&&h<=e&&g>=f&&g<=i)d[h-j][g-f]=c.content.$t;b.dataFound()})},findHeaderRow:function(){k(this.columns,function(){});this.headerRow=0},trim:function(b){return typeof b==="string"?b.replace(/^\s+|\s+$/g,""):b},parseTypes:function(){for(var b=this.columns,a=b.length,c,d,f,i;a--;)for(c=b[a].length;c--;)d=b[a][c],f=parseFloat(d),i=this.trim(d),
-i==f?(b[a][c]=f,f>31536E6?b[a].isDatetime=!0:b[a].isNumeric=!0):(d=this.parseDate(d),a===0&&typeof d==="number"&&!isNaN(d)?(b[a][c]=d,b[a].isDatetime=!0):b[a][c]=i===""?null:i)},dateFormats:{"YYYY-mm-dd":{regex:"^([0-9]{4})-([0-9]{2})-([0-9]{2})$",parser:function(b){return Date.UTC(+b[1],b[2]-1,+b[3])}}},parseDate:function(b){var a=this.options.parseDate,c,d,f;a&&(c=a(b));if(typeof b==="string")for(d in this.dateFormats)a=this.dateFormats[d],(f=b.match(a.regex))&&(c=a.parser(f));return c},rowsToColumns:function(b){var a,
-c,d,f,i;if(b){i=[];c=b.length;for(a=0;a<c;a++){f=b[a].length;for(d=0;d<f;d++)i[d]||(i[d]=[]),i[d][a]=b[a][d]}}return i},parsed:function(){this.options.parsed&&this.options.parsed.call(this,this.columns)},complete:function(){var b=this.columns,a,c,d=this.options,f,i,j,e,g,k;if(d.complete){this.getColumnDistribution();b.length>1&&(a=b.shift(),this.headerRow===0&&a.shift(),a.isDatetime?c="datetime":a.isNumeric||(c="category"));for(e=0;e<b.length;e++)if(this.headerRow===0)b[e].name=b[e].shift();i=[];
-for(e=0,k=0;e<b.length;k++){f=h.pick(this.valueCount.individual[k],this.valueCount.global);j=[];for(g=0;g<b[e].length;g++)j[g]=[a[g],b[e][g]!==void 0?b[e][g]:null],f>1&&j[g].push(b[e+1][g]!==void 0?b[e+1][g]:null),f>2&&j[g].push(b[e+2][g]!==void 0?b[e+2][g]:null),f>3&&j[g].push(b[e+3][g]!==void 0?b[e+3][g]:null),f>4&&j[g].push(b[e+4][g]!==void 0?b[e+4][g]:null);i[k]={name:b[e].name,data:j};e+=f}d.complete({xAxis:{type:c},series:i})}}});h.Data=m;h.data=function(b,a){return new m(b,a)};h.wrap(h.Chart.prototype,
-"init",function(b,a,c){var d=this;a&&a.data?h.data(h.extend(a.data,{complete:function(f){a.series&&k(a.series,function(b,c){a.series[c]=h.merge(b,f.series[c])});a=h.merge(f,a);b.call(d,a,c)}}),a):b.call(d,a,c)})})(Highcharts);
+ * The Highcharts Data plugin is a utility to ease parsing of input sources like
+ * CSV, HTML tables or grid views into basic configuration options for use 
+ * directly in the Highcharts constructor.
+ *
+ * Demo: http://jsfiddle.net/highcharts/SnLFj/
+ *
+ * --- OPTIONS ---
+ *
+ * - columns : Array<Array<Mixed>>
+ * A two-dimensional array representing the input data on tabular form. This input can
+ * be used when the data is already parsed, for example from a grid view component.
+ * Each cell can be a string or number. If not switchRowsAndColumns is set, the columns
+ * are interpreted as series. See also the rows option.
+ *
+ * - complete : Function(chartOptions)
+ * The callback that is evaluated when the data is finished loading, optionally from an 
+ * external source, and parsed. The first argument passed is a finished chart options
+ * object, containing series and an xAxis with categories if applicable. Thise options
+ * can be extended with additional options and passed directly to the chart constructor.
+ *
+ * - csv : String
+ * A comma delimited string to be parsed. Related options are startRow, endRow, startColumn
+ * and endColumn to delimit what part of the table is used. The lineDelimiter and 
+ * itemDelimiter options define the CSV delimiter formats.
+ * 
+ * - endColumn : Integer
+ * In tabular input data, the first row (indexed by 0) to use. Defaults to the last 
+ * column containing data.
+ *
+ * - endRow : Integer
+ * In tabular input data, the last row (indexed by 0) to use. Defaults to the last row
+ * containing data.
+ *
+ * - googleSpreadsheetKey : String 
+ * A Google Spreadsheet key. See https://developers.google.com/gdata/samples/spreadsheet_sample
+ * for general information on GS.
+ *
+ * - googleSpreadsheetWorksheet : String 
+ * The Google Spreadsheet worksheet. The available id's can be read from 
+ * https://spreadsheets.google.com/feeds/worksheets/{key}/public/basic
+ *
+ * - itemDelimiter : String
+ * Item or cell delimiter for parsing CSV. Defaults to ",".
+ *
+ * - lineDelimiter : String
+ * Line delimiter for parsing CSV. Defaults to "\n".
+ *
+ * - parsed : Function
+ * A callback function to access the parsed columns, the two-dimentional input data
+ * array directly, before they are interpreted into series data and categories.
+ *
+ * - parseDate : Function
+ * A callback function to parse string representations of dates into JavaScript timestamps.
+ * Return an integer on success.
+ *
+ * - rows : Array<Array<Mixed>>
+ * The same as the columns input option, but defining rows intead of columns.
+ *
+ * - startColumn : Integer
+ * In tabular input data, the first column (indexed by 0) to use. 
+ *
+ * - startRow : Integer
+ * In tabular input data, the first row (indexed by 0) to use.
+ *
+ * - table : String|HTMLElement
+ * A HTML table or the id of such to be parsed as input data. Related options ara startRow,
+ * endRow, startColumn and endColumn to delimit what part of the table is used.
+ */
+
+// JSLint options:
+/*global jQuery */
+
+(function (Highcharts) {	
+	
+	// Utilities
+	var each = Highcharts.each;
+	
+	
+	// The Data constructor
+	var Data = function (dataOptions, chartOptions) {
+		this.init(dataOptions, chartOptions);
+	};
+	
+	// Set the prototype properties
+	Highcharts.extend(Data.prototype, {
+		
+	/**
+	 * Initialize the Data object with the given options
+	 */
+	init: function (options, chartOptions) {
+		this.options = options;
+		this.chartOptions = chartOptions;
+		this.columns = options.columns || this.rowsToColumns(options.rows) || [];
+
+		// No need to parse or interpret anything
+		if (this.columns.length) {
+			this.dataFound();
+
+		// Parse and interpret
+		} else {
+
+			// Parse a CSV string if options.csv is given
+			this.parseCSV();
+			
+			// Parse a HTML table if options.table is given
+			this.parseTable();
+
+			// Parse a Google Spreadsheet 
+			this.parseGoogleSpreadsheet();	
+		}
+
+	},
+
+	/**
+	 * Get the column distribution. For example, a line series takes a single column for 
+	 * Y values. A range series takes two columns for low and high values respectively,
+	 * and an OHLC series takes four columns.
+	 */
+	getColumnDistribution: function () {
+		var chartOptions = this.chartOptions,
+			getValueCount = function (type) {
+				return (Highcharts.seriesTypes[type || 'line'].prototype.pointArrayMap || [0]).length;
+			},
+			globalType = chartOptions && chartOptions.chart && chartOptions.chart.type,
+			individualCounts = [];
+
+		each((chartOptions && chartOptions.series) || [], function (series) {
+			individualCounts.push(getValueCount(series.type || globalType));
+		});
+
+		this.valueCount = {
+			global: getValueCount(globalType),
+			individual: individualCounts
+		};
+	},
+
+
+	dataFound: function () {
+		// Interpret the values into right types
+		this.parseTypes();
+		
+		// Use first row for series names?
+		this.findHeaderRow();
+		
+		// Handle columns if a handleColumns callback is given
+		this.parsed();
+		
+		// Complete if a complete callback is given
+		this.complete();
+		
+	},
+	
+	/**
+	 * Parse a CSV input string
+	 */
+	parseCSV: function () {
+		var self = this,
+			options = this.options,
+			csv = options.csv,
+			columns = this.columns,
+			startRow = options.startRow || 0,
+			endRow = options.endRow || Number.MAX_VALUE,
+			startColumn = options.startColumn || 0,
+			endColumn = options.endColumn || Number.MAX_VALUE,
+			lines,
+			activeRowNo = 0;
+			
+		if (csv) {
+			
+			lines = csv
+				.replace(/\r\n/g, "\n") // Unix
+				.replace(/\r/g, "\n") // Mac
+				.split(options.lineDelimiter || "\n");
+			
+			each(lines, function (line, rowNo) {
+				var trimmed = self.trim(line),
+					isComment = trimmed.indexOf('#') === 0,
+					isBlank = trimmed === '',
+					items;
+				
+				if (rowNo >= startRow && rowNo <= endRow && !isComment && !isBlank) {
+					items = line.split(options.itemDelimiter || ',');
+					each(items, function (item, colNo) {
+						if (colNo >= startColumn && colNo <= endColumn) {
+							if (!columns[colNo - startColumn]) {
+								columns[colNo - startColumn] = [];					
+							}
+							
+							columns[colNo - startColumn][activeRowNo] = item;
+						}
+					});
+					activeRowNo += 1;
+				}
+			});
+
+			this.dataFound();
+		}
+	},
+	
+	/**
+	 * Parse a HTML table
+	 */
+	parseTable: function () {
+		var options = this.options,
+			table = options.table,
+			columns = this.columns,
+			startRow = options.startRow || 0,
+			endRow = options.endRow || Number.MAX_VALUE,
+			startColumn = options.startColumn || 0,
+			endColumn = options.endColumn || Number.MAX_VALUE,
+			colNo;
+			
+		if (table) {
+			
+			if (typeof table === 'string') {
+				table = document.getElementById(table);
+			}
+			
+			each(table.getElementsByTagName('tr'), function (tr, rowNo) {
+				colNo = 0; 
+				if (rowNo >= startRow && rowNo <= endRow) {
+					each(tr.childNodes, function (item) {
+						if ((item.tagName === 'TD' || item.tagName === 'TH') && colNo >= startColumn && colNo <= endColumn) {
+							if (!columns[colNo]) {
+								columns[colNo] = [];					
+							}
+							columns[colNo][rowNo - startRow] = item.innerHTML;
+							
+							colNo += 1;
+						}
+					});
+				}
+			});
+
+			this.dataFound(); // continue
+		}
+	},
+
+	/**
+	 * TODO: 
+	 * - switchRowsAndColumns
+	 */
+	parseGoogleSpreadsheet: function () {
+		var self = this,
+			options = this.options,
+			googleSpreadsheetKey = options.googleSpreadsheetKey,
+			columns = this.columns,
+			startRow = options.startRow || 0,
+			endRow = options.endRow || Number.MAX_VALUE,
+			startColumn = options.startColumn || 0,
+			endColumn = options.endColumn || Number.MAX_VALUE,
+			gr, // google row
+			gc; // google column
+
+		if (googleSpreadsheetKey) {
+			jQuery.getJSON('https://spreadsheets.google.com/feeds/cells/' + 
+				  googleSpreadsheetKey + '/' + (options.googleSpreadsheetWorksheet || 'od6') +
+					  '/public/values?alt=json-in-script&callback=?',
+					  function (json) {
+					
+				// Prepare the data from the spreadsheat
+				var cells = json.feed.entry,
+					cell,
+					cellCount = cells.length,
+					colCount = 0,
+					rowCount = 0,
+					i;
+			
+				// First, find the total number of columns and rows that 
+				// are actually filled with data
+				for (i = 0; i < cellCount; i++) {
+					cell = cells[i];
+					colCount = Math.max(colCount, cell.gs$cell.col);
+					rowCount = Math.max(rowCount, cell.gs$cell.row);			
+				}
+			
+				// Set up arrays containing the column data
+				for (i = 0; i < colCount; i++) {
+					if (i >= startColumn && i <= endColumn) {
+						// Create new columns with the length of either end-start or rowCount
+						columns[i - startColumn] = [];
+
+						// Setting the length to avoid jslint warning
+						columns[i - startColumn].length = Math.min(rowCount, endRow - startRow);
+					}
+				}
+				
+				// Loop over the cells and assign the value to the right
+				// place in the column arrays
+				for (i = 0; i < cellCount; i++) {
+					cell = cells[i];
+					gr = cell.gs$cell.row - 1; // rows start at 1
+					gc = cell.gs$cell.col - 1; // columns start at 1
+
+					// If both row and col falls inside start and end
+					// set the transposed cell value in the newly created columns
+					if (gc >= startColumn && gc <= endColumn &&
+						gr >= startRow && gr <= endRow) {
+						columns[gc - startColumn][gr - startRow] = cell.content.$t;
+					}
+				}
+				self.dataFound();
+			});
+		}
+	},
+	
+	/**
+	 * Find the header row. For now, we just check whether the first row contains
+	 * numbers or strings. Later we could loop down and find the first row with 
+	 * numbers.
+	 */
+	findHeaderRow: function () {
+		var headerRow = 0;
+		each(this.columns, function (column) {
+			if (typeof column[0] !== 'string') {
+				headerRow = null;
+			}
+		});
+		this.headerRow = 0;			
+	},
+	
+	/**
+	 * Trim a string from whitespace
+	 */
+	trim: function (str) {
+		return typeof str === 'string' ? str.replace(/^\s+|\s+$/g, '') : str;
+	},
+	
+	/**
+	 * Parse numeric cells in to number types and date types in to true dates.
+	 * @param {Object} columns
+	 */
+	parseTypes: function () {
+		var columns = this.columns,
+			col = columns.length, 
+			row,
+			val,
+			floatVal,
+			trimVal,
+			dateVal;
+			
+		while (col--) {
+			row = columns[col].length;
+			while (row--) {
+				val = columns[col][row];
+				floatVal = parseFloat(val);
+				trimVal = this.trim(val);
+
+				/*jslint eqeq: true*/
+				if (trimVal == floatVal) { // is numeric
+				/*jslint eqeq: false*/
+					columns[col][row] = floatVal;
+					
+					// If the number is greater than milliseconds in a year, assume datetime
+					if (floatVal > 365 * 24 * 3600 * 1000) {
+						columns[col].isDatetime = true;
+					} else {
+						columns[col].isNumeric = true;
+					}					
+				
+				} else { // string, continue to determine if it is a date string or really a string
+					dateVal = this.parseDate(val);
+					
+					if (col === 0 && typeof dateVal === 'number' && !isNaN(dateVal)) { // is date
+						columns[col][row] = dateVal;
+						columns[col].isDatetime = true;
+					
+					} else { // string
+						columns[col][row] = trimVal === '' ? null : trimVal;
+					}
+				}
+				
+			}
+		}
+	},
+	//*
+	dateFormats: {
+		'YYYY-mm-dd': {
+			regex: '^([0-9]{4})-([0-9]{2})-([0-9]{2})$',
+			parser: function (match) {
+				return Date.UTC(+match[1], match[2] - 1, +match[3]);
+			}
+		}
+	},
+	// */
+	/**
+	 * Parse a date and return it as a number. Overridable through options.parseDate.
+	 */
+	parseDate: function (val) {
+		var parseDate = this.options.parseDate,
+			ret,
+			key,
+			format,
+			match;
+
+		if (parseDate) {
+			ret = parseDate(val);
+		}
+			
+		if (typeof val === 'string') {
+			for (key in this.dateFormats) {
+				format = this.dateFormats[key];
+				match = val.match(format.regex);
+				if (match) {
+					ret = format.parser(match);
+				}
+			}
+		}
+		return ret;
+	},
+	
+	/**
+	 * Reorganize rows into columns
+	 */
+	rowsToColumns: function (rows) {
+		var row,
+			rowsLength,
+			col,
+			colsLength,
+			columns;
+
+		if (rows) {
+			columns = [];
+			rowsLength = rows.length;
+			for (row = 0; row < rowsLength; row++) {
+				colsLength = rows[row].length;
+				for (col = 0; col < colsLength; col++) {
+					if (!columns[col]) {
+						columns[col] = [];
+					}
+					columns[col][row] = rows[row][col];
+				}
+			}
+		}
+		return columns;
+	},
+	
+	/**
+	 * A hook for working directly on the parsed columns
+	 */
+	parsed: function () {
+		if (this.options.parsed) {
+			this.options.parsed.call(this, this.columns);
+		}
+	},
+	
+	/**
+	 * If a complete callback function is provided in the options, interpret the 
+	 * columns into a Highcharts options object.
+	 */
+	complete: function () {
+		
+		var columns = this.columns,
+			firstCol,
+			type,
+			options = this.options,
+			valueCount,
+			series,
+			data,
+			i,
+			j,
+			seriesIndex;
+			
+		
+		if (options.complete) {
+
+			this.getColumnDistribution();
+			
+			// Use first column for X data or categories?
+			if (columns.length > 1) {
+				firstCol = columns.shift();
+				if (this.headerRow === 0) {
+					firstCol.shift(); // remove the first cell
+				}
+				
+				
+				if (firstCol.isDatetime) {
+					type = 'datetime';
+				} else if (!firstCol.isNumeric) {
+					type = 'category';
+				}
+			}
+
+			// Get the names and shift the top row
+			for (i = 0; i < columns.length; i++) {
+				if (this.headerRow === 0) {
+					columns[i].name = columns[i].shift();
+				}
+			}
+			
+			// Use the next columns for series
+			series = [];
+			for (i = 0, seriesIndex = 0; i < columns.length; seriesIndex++) {
+
+				// This series' value count
+				valueCount = Highcharts.pick(this.valueCount.individual[seriesIndex], this.valueCount.global);
+				
+				// Iterate down the cells of each column and add data to the series
+				data = [];
+				for (j = 0; j < columns[i].length; j++) {
+					data[j] = [
+						firstCol[j], 
+						columns[i][j] !== undefined ? columns[i][j] : null
+					];
+					if (valueCount > 1) {
+						data[j].push(columns[i + 1][j] !== undefined ? columns[i + 1][j] : null);
+					}
+					if (valueCount > 2) {
+						data[j].push(columns[i + 2][j] !== undefined ? columns[i + 2][j] : null);
+					}
+					if (valueCount > 3) {
+						data[j].push(columns[i + 3][j] !== undefined ? columns[i + 3][j] : null);
+					}
+					if (valueCount > 4) {
+						data[j].push(columns[i + 4][j] !== undefined ? columns[i + 4][j] : null);
+					}
+				}
+
+				// Add the series
+				series[seriesIndex] = {
+					name: columns[i].name,
+					data: data
+				};
+
+				i += valueCount;
+			}
+			
+			// Do the callback
+			options.complete({
+				xAxis: {
+					type: type
+				},
+				series: series
+			});
+		}
+	}
+	});
+	
+	// Register the Data prototype and data function on Highcharts
+	Highcharts.Data = Data;
+	Highcharts.data = function (options, chartOptions) {
+		return new Data(options, chartOptions);
+	};
+
+	// Extend Chart.init so that the Chart constructor accepts a new configuration
+	// option group, data.
+	Highcharts.wrap(Highcharts.Chart.prototype, 'init', function (proceed, userOptions, callback) {
+		var chart = this;
+
+		if (userOptions && userOptions.data) {
+			Highcharts.data(Highcharts.extend(userOptions.data, {
+				complete: function (dataOptions) {
+					
+					// Merge series configs
+					if (userOptions.series) {
+						each(userOptions.series, function (series, i) {
+							userOptions.series[i] = Highcharts.merge(series, dataOptions.series[i]);
+						});
+					}
+
+					// Do the merge
+					userOptions = Highcharts.merge(dataOptions, userOptions);
+
+					proceed.call(chart, userOptions, callback);
+				}
+			}), userOptions);
+		} else {
+			proceed.call(chart, userOptions, callback);
+		}
+	});
+
+}(Highcharts));