4 <link rel=
"stylesheet" href=
"../dist/dygraph.css">
5 <title>callbacks
</title>
6 <script type=
"text/javascript" src=
"../dist/dygraph.js"></script>
8 <script type=
"text/javascript" src=
"data.js"></script>
9 <style type=
"text/css">
22 <p>Hover, click and zoom to test the callbacks:
</p>
23 <div id=
"div_g" style=
"width:600px; height:300px;"></div>
25 <input type=
"button" value=
"Clear list" onclick=
"javascript:document.getElementById('status').innerHTML=''" />
26 <input type=
"checkbox" id=
"highlight" checked
><label for=
"highlight"> Show 'highlight' events
</label>
27 <input type=
"checkbox" id=
"unhighlight" checked
><label for=
"unhighlight">Show 'unhighlight' events
</label>
28 <input type=
"checkbox" id=
"showLabels" checked
29 onclick='g.updateOptions({showLabelsOnHighlight: this.checked});'
>
30 <label for=
"showLabels"> Show Labels on highlight
</label>
31 <div id=
"status" style=
"width:100%; height:200px;"></div>
33 <script type=
"text/javascript">
34 s = document.getElementById(
"status");
36 pts_info = function(e, x, pts, row) {
37 var str =
"(" + x +
") ";
38 for (var i =
0; i < pts.length; i++) {
41 str += p.name +
": " + p.yval;
46 var dataXY = g.toDataCoords(x, y);
47 str +=
", (" + x +
", " + y +
")";
48 str +=
" -> (" + dataXY[
0] +
", " + dataXY[
1] +
")";
55 document.getElementById(
"div_g"),
61 highlightCallback: function(e, x, pts, row) {
62 if (document.getElementById('highlight').checked) {
63 s.innerHTML +=
"<b>Highlight</b> " + pts_info(e,x,pts,row) +
"<br/>";
67 unhighlightCallback: function(e) {
68 if (document.getElementById('unhighlight').checked) {
69 s.innerHTML +=
"<b>Unhighlight</b><br/>";
73 clickCallback: function(e, x, pts) {
74 s.innerHTML +=
"<b>Click</b> " + pts_info(e,x,pts) +
"<br/>";
77 pointClickCallback: function(e, p) {
78 s.innerHTML +=
"<b>Point Click</b> " + p.name +
": " + p.x +
"<br/>";
81 zoomCallback: function(minX, maxX, yRanges) {
82 s.innerHTML +=
"<b>Zoom</b> [" + minX +
", " + maxX +
", [" + yRanges +
"]]<br/>";
85 drawCallback: function(g) {
86 s.innerHTML +=
"<b>Draw</b> [" + g.xAxisRange() +
"]<br/>";