};
/**
+ * 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.<Object>} 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
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;
"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"
-}
--- /dev/null
+<html>
+ <head>
+ <title>noise</title>
+ <!--[if IE]>
+ <script type="text/javascript" src="excanvas.js"></script>
+ <![endif]-->
+ <script type="text/javascript" src="../dygraph-combined.js"></script>
+ <script type="text/javascript" src="../dygraph.js"></script>
+ <script type="text/javascript" src="http://www.google.com/jsapi"></script>
+ <script type="text/javascript">
+ google.load('visualization', '1', {packages: ['linechart']});
+
+ function drawVisualization() {
+ data = new google.visualization.DataTable();
+ data.addColumn('date', 'Date');
+ data.addColumn('number', 'Column A');
+ data.addColumn('number', 'Column B');
+ data.addRows(4);
+ data.setCell(0, 0, new Date("2009/07/01"));
+ data.setCell(0, 1, 1);
+ data.setCell(0, 2, 7);
+ data.setCell(1, 0, new Date("2009/07/08"));
+ data.setCell(1, 1, 2);
+ data.setCell(1, 2, 4);
+ data.setCell(2, 0, new Date("2009/07/15"));
+ data.setCell(2, 1, 3);
+ data.setCell(2, 2, 3);
+ data.setCell(3, 0, new Date("2009/07/22"));
+ data.setCell(3, 1, 4);
+ data.setCell(3, 2, 0);
+
+ new google.visualization.LineChart(
+ document.getElementById('gviz')). draw(data, null);
+
+ new DateGraph(document.getElementById('dygraphs'), data, null, {});
+ }
+ google.setOnLoadCallback(drawVisualization);
+ </script>
+ </head>
+ <body>
+ <p>gviz line chart:</p>
+ <div id="gviz" style="width:600px; height:300px;"></div>
+
+ <p>same data drawn using dygraphs:</p>
+ <div id="dygraphs" style="width:600px; height:300px;"></div>
+ </body>
+</html>
<script type="text/javascript">
g = new DateGraph(
document.getElementById("g"),
- HourlyData, null, {}
+ 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"
+ }, null, {}
);
gm = new DateGraph(