<html>
<head>
- <title>gviz</title>
+ <title>gviz selection</title>
<!--[if IE]>
<script type="text/javascript" src="excanvas.js"></script>
<![endif]-->
<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']});
+ google.load('visualization', '1');
function createDataTable(dateType) {
data = new google.visualization.DataTable();
data.setCell(9, 2, 8);
return data;
}
-
+
var chart;
function drawVisualization() {
chart.draw(data, {hideOverlayOnMouseOut: false});
}
-
+
function setSelection() {
var sel = [{column: 1, row: 2}, {column: 2, row: 2}];
chart.setSelection(sel);
}
function getChartSelection() {
var sel = chart.getSelection();
-
+
var html = '<p>Selection: [';
- for (var i=0; i<sel.length; i++) {
- if (i>0) html += ', ';
- html += i + '=> {row: '+sel[i].row + ' col: '+ sel[i].column + '}';
+ for (var i = 0; i < sel.length; i++) {
+ if (i > 0) html += ', ';
+ html += i + '=> {row: '+ sel[i].row +
+ ' col: '+ sel[i].column + '}';
}
html += ']</p>';
document.getElementById('output').innerHTML += html;
</script>
</head>
<body>
- <p>same data drawn using dygraphs:</p>
- date column:
+ <p>Get/Set/Clear selection via gviz API:</p>
<div id="dygraphs" style="width:600px; height:300px;"></div>
<input type="button" onclick="setSelection()" value="setSelection()"/>
<input type="button" onclick="clearSelection()" value="clearSelection()"/>