From 79420a1ea6ab965657553c055858398ecf4b7699 Mon Sep 17 00:00:00 2001 From: Dan Vanderkam Date: Thu, 27 Aug 2009 18:41:08 +0000 Subject: [PATCH] add very basic support for gviz DataTable input --- dygraph.js | 49 +++++++++++++++++++++++++++++++++++++++++++++++++ tests/data.js | 11 ----------- tests/gviz.html | 47 +++++++++++++++++++++++++++++++++++++++++++++++ tests/hourly.html | 12 +++++++++++- 4 files changed, 107 insertions(+), 12 deletions(-) create mode 100644 tests/gviz.html diff --git a/dygraph.js b/dygraph.js index fde3c5a..2ba42c9 100644 --- a/dygraph.js +++ b/dygraph.js @@ -1059,6 +1059,50 @@ DateGraph.prototype.parseCSV_ = function(data) { }; /** + * Parses a DataTable object from gviz. + * The data is expected to have a first column that is either a date or a + * number. All subsequent columns must be numbers. If there is a clear mismatch + * between this.xValueParser_ and the type of the first column, it will be + * fixed. Returned value is in the same format as return value of parseCSV_. + * @param {Array.} data See above. + * @private + */ +DateGraph.prototype.parseDataTable_ = function(data) { + var cols = data.getNumberOfColumns(); + var rows = data.getNumberOfRows(); + + // Read column labels + var labels = []; + for (var i = 0; i < cols; i++) { + labels.push(data.getColumnLabel(i)); + } + labels.shift(); // a "date" parameter is assumed. + this.labels_ = labels; + // regenerate automatic colors. + this.setColors_(this.attrs_); + this.renderOptions_.colorScheme = this.colors_; + MochiKit.Base.update(this.plotter_.options, this.renderOptions_); + MochiKit.Base.update(this.layoutOptions_, this.attrs_); + + // Assume column 1 is a date type for now. + if (data.getColumnType(0) != 'date') { + alert("only date type is support for column 1 of DataTable input."); + return null; + } + + var ret = []; + for (var i = 0; i < rows; i++) { + var row = []; + row.push(data.getValue(i, 0).getTime()); + for (var j = 1; j < cols; j++) { + row.push(data.getValue(i, j)); + } + ret.push(row); + } + return ret; +} + +/** * Get the CSV data. If it's in a function, call that function. If it's in a * file, do an XMLHttpRequest to get it. * @private @@ -1067,6 +1111,11 @@ DateGraph.prototype.start_ = function() { if (typeof this.file_ == 'function') { // Stubbed out to allow this to run off a filesystem this.loadedEvent_(this.file_()); + } else if (typeof this.file_ == 'object' && + typeof this.file_.getColumnRange == 'function') { + // must be a DataTable from gviz. + this.rawData_ = this.parseDataTable_(this.file_); + this.drawGraph_(this.rawData_); } else { var req = new XMLHttpRequest(); var caller = this; diff --git a/tests/data.js b/tests/data.js index c843d13..68b6187 100644 --- a/tests/data.js +++ b/tests/data.js @@ -432,14 +432,3 @@ return "" + "20061129,1.41093474427,0.495309102312,3.02013422819,0.701020603129"; } -function HourlyData() { -return "" + -"Date,A,B\n" + -"2009/07/12 00:00:00,3,4\n" + -"2009/07/12 01:00:00,5,6\n" + -"2009/07/12 02:00:00,7,6\n" + -"2009/07/12 03:00:00,6,5\n" + -"2009/07/12 04:00:00,4,7\n" + -"2009/07/12 05:00:00,3,6\n" + -"2009/07/12 06:00:00,4,6" -} diff --git a/tests/gviz.html b/tests/gviz.html new file mode 100644 index 0000000..812ff3f --- /dev/null +++ b/tests/gviz.html @@ -0,0 +1,47 @@ + + + noise + + + + + + + +

gviz line chart:

+
+ +

same data drawn using dygraphs:

+
+ + diff --git a/tests/hourly.html b/tests/hourly.html index 31bd15b..7465e51 100644 --- a/tests/hourly.html +++ b/tests/hourly.html @@ -18,7 +18,17 @@