From 36d4fabf9450c8bbada738fb7820c723a0b939fa Mon Sep 17 00:00:00 2001 From: Robert Konigsberg Date: Sat, 7 Jan 2012 07:47:42 -0500 Subject: [PATCH] Support function() returning other data types. --- auto_tests/misc/local.html | 1 + auto_tests/tests/formats.js | 72 +++++++++++++++++++++++++++++++++ docs/data.html | 2 + dygraph.js | 30 ++++++++------ experimental/palette/index.html | 13 +++++- experimental/palette/index.js | 89 +++++++++++++++++------------------------ 6 files changed, 139 insertions(+), 68 deletions(-) create mode 100644 auto_tests/tests/formats.js diff --git a/auto_tests/misc/local.html b/auto_tests/misc/local.html index 5bdf428..616f59e 100644 --- a/auto_tests/misc/local.html +++ b/auto_tests/misc/local.html @@ -35,6 +35,7 @@ + diff --git a/auto_tests/tests/formats.js b/auto_tests/tests/formats.js new file mode 100644 index 0000000..78e2240 --- /dev/null +++ b/auto_tests/tests/formats.js @@ -0,0 +1,72 @@ +/** + * @fileoverview Tests for data formats. + * + * @author konigsberg@google.com (Robert Konigsberg) + */ +var FormatsTestCase = TestCase("formats"); + +FormatsTestCase.prototype.setUp = function() { + document.body.innerHTML = "
"; +}; + +FormatsTestCase.prototype.tearDown = function() { +}; + +FormatsTestCase.prototype.dataString = + "X,Y\n" + + "0,-1\n" + + "1,0\n" + + "2,1\n" + + "3,0\n"; + +FormatsTestCase.prototype.dataArray = + [[0,-1], + [1,0], + [2,1], + [3,0]]; + +FormatsTestCase.prototype.testCsv = function() { + var data = this.dataString; + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, {}); + this.assertData(g); +}; + +FormatsTestCase.prototype.testArray = function() { + var data = this.dataArray; + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, {}); + this.assertData(g); +}; + +FormatsTestCase.prototype.testFunctionReturnsCsv = function() { + var string = this.dataString; + var data = function() { return string; }; + + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, {}); + // this.assertData(g); + console.log("x"); +}; + +FormatsTestCase.prototype.testFunctionDefinesArray = function() { + var array = this.dataArray; + var data = function() { return array; } + + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, {}); + this.assertData(g); +}; + +FormatsTestCase.prototype.assertData = function(g) { + var expected = this.dataArray; + + assertEquals(4, g.numRows()); + assertEquals(2, g.numColumns()); + + for (var i = 0; i < 4; i++) { + for (var j = 0; j < 2; j++) { + assertEquals(expected[i][j], g.getValue(i, j)); + } + } +} diff --git a/docs/data.html b/docs/data.html index bf1e897..b010407 100644 --- a/docs/data.html +++ b/docs/data.html @@ -304,6 +304,8 @@ function() { return x; } + Functions can return strings, arrays, data tables, URLs, or any other data type. +

DataTable

You can also specify a Google Visualization Library DataTable diff --git a/dygraph.js b/dygraph.js index 9264961..66432f7 100644 --- a/dygraph.js +++ b/dygraph.js @@ -2897,21 +2897,25 @@ Dygraph.prototype.parseDataTable_ = function(data) { * @private */ Dygraph.prototype.start_ = function() { - if (typeof this.file_ == 'function') { - // CSV string. Pretend we got it via XHR. - this.loadedEvent_(this.file_()); - } else if (Dygraph.isArrayLike(this.file_)) { - this.rawData_ = this.parseArray_(this.file_); + var data = this.file_; + + // Functions can return references of all other types. + if (typeof data == 'function') { + data = data(); + } + + if (Dygraph.isArrayLike(data)) { + this.rawData_ = this.parseArray_(data); this.predraw_(); - } else if (typeof this.file_ == 'object' && - typeof this.file_.getColumnRange == 'function') { + } else if (typeof data == 'object' && + typeof data.getColumnRange == 'function') { // must be a DataTable from gviz. - this.parseDataTable_(this.file_); + this.parseDataTable_(data); this.predraw_(); - } else if (typeof this.file_ == 'string') { + } else if (typeof data == 'string') { // Heuristic: a newline means it's CSV data. Otherwise it's an URL. - if (this.file_.indexOf('\n') >= 0) { - this.loadedEvent_(this.file_); + if (data.indexOf('\n') >= 0) { + this.loadedEvent_(data); } else { var req = new XMLHttpRequest(); var caller = this; @@ -2924,11 +2928,11 @@ Dygraph.prototype.start_ = function() { } }; - req.open("GET", this.file_, true); + req.open("GET", data, true); req.send(null); } } else { - this.error("Unknown data format: " + (typeof this.file_)); + this.error("Unknown data format: " + (typeof data)); } }; diff --git a/experimental/palette/index.html b/experimental/palette/index.html index 8bed76e..dc13209 100644 --- a/experimental/palette/index.html +++ b/experimental/palette/index.html @@ -9,8 +9,9 @@ + - + @@ -21,6 +22,14 @@
+
+ +
Other messages: @@ -86,5 +95,5 @@
- + diff --git a/experimental/palette/index.js b/experimental/palette/index.js index 6598602..518f4b2 100644 --- a/experimental/palette/index.js +++ b/experimental/palette/index.js @@ -26,71 +26,54 @@ "use strict"; -function draw(element, options) { - try { - element.innerHTML = ""; - element.removeAttribute("style"); - var g = new Dygraph( - element, - function() { - var zp = function(x) { if (x < 10) return "0"+x; else return x; }; - var r = "date,parabola,line,another line,sine wave\n"; - for (var i=1; i<=31; i++) { - r += "201110" + zp(i); - r += "," + 10*(i*(31-i)); - r += "," + 10*(8*i); - r += "," + 10*(250 - 8*i); - r += "," + 10*(125 + 125 * Math.sin(0.3*i)); - r += "\n"; - } - return r; - }, options - ); - - // These don't work yet. - g.updateOptions({ - labelsDiv: 'status', - }); - } catch(err) { - addMessage(err); - throw(err); - } finally { +var Index = {}; + +Index.splitVariables = function() { // http://www.idealog.us/2006/06/javascript_to_p.html + var query = window.location.search.substring(1); + var args = {}; + var vars = query.split("&"); + for (var i = 0;i < vars.length; i++) { + var pair = vars[i].split("="); + args[pair[0]] = pair[1]; } + return args; } -function addMessage(text) { +Index.draw = function(element, data, options) { + element.innerHTML = ""; + element.removeAttribute("style"); + var g = new Dygraph( + element, + data, + options + ); + + // These don't work yet. + g.updateOptions({ + labelsDiv: 'status', + }); +} + +Index.addMessage = function(text) { var messages = document.getElementById("messages"); messages.innerText = messages.innerText + text + "\n"; } -function start() { - var options = { - colors: [ - "rgb(51,204,204)", - "rgb(255,100,100)", - "#00DD55", - "rgba(50,50,200,0.4)" - ], - labelsSeparateLines: true, - labelsKMB: true, - legend: 'always', - width: 640, - height: 480, - title: 'Interesting Shapes', - xlabel: 'Date', - ylabel: 'Count', - axisLineColor: 'white', - drawXGrid: false, - pointClickCallback: function() { alert("p-click!"); }, - }; - +Index.start = function() { + var variables = Index.splitVariables(); + var sampleIndex = variables["sampleIndex"]; + if (!(sampleIndex)) { + sampleIndex = 0; + } + var sample = Samples.samples[sampleIndex]; + var data = sample.data; var redraw = function() { - draw(document.getElementById("graph"), palette.read()); + Index.draw(document.getElementById("graph"), data, palette.read()); } var palette = new Palette(); palette.create(document, document.getElementById("optionsPalette")); - palette.write(options); + palette.write(sample.options); palette.onchange = redraw; palette.filterBar.focus(); redraw(); -- 2.7.4