4 <meta http-equiv=
"X-UA-Compatible" content=
"IE=EmulateIE7; IE=EmulateIE9">
5 <title>interaction model
</title>
7 <script type=
"text/javascript" src=
"../excanvas.js"></script>
10 For production (minified) code, use:
11 <script type=
"text/javascript" src=
"dygraph-combined.js"></script>
13 <script type=
"text/javascript" src=
"../dygraph-dev.js"></script>
15 <script type=
"text/javascript" src=
"data.js"></script>
16 <script type=
"text/javascript" src=
"interaction.js"></script>
21 <b>Default interaction model
</b>
22 <div id=
"div_g" style=
"width:600px; height:300px;"></div>
23 </td><td>Zoom: click-drag
<br/>Pan: shift-click-drag
<br/>Restore zoom level: double-click
<br/>
26 <b>No interaction model
</b>
27 <div id=
"div_g2" style=
"width:600px; height:300px;"></div>
28 </td><td>Click and drag all you like, it won't do anything!
29 <div id=
"g2_console"></div>
32 <b>Custom interaction model
</b>
34 <input type=
"button" value=
"Restore position" onclick=
"restorePositioning(g3)">
35 <div id=
"div_g3" style=
"width:600px; height:300px;"></div>
37 Zoom in: double-click, scroll wheel
<br/>
38 Zoom out: ctrl-double-click, scroll wheel
<br/>
39 Standard Zoom: shift-click-drag
40 Standard Pan: click-drag
<br/>
41 Restore zoom level: press button
<br/>
45 <div id=
"div_g4" style=
"width:600px; height:300px;"></div>
47 Keep the mouse button pressed, and hover over all points
53 <script type=
"text/javascript">
54 Dygraph.addEvent(document,
"mousewheel", function() { lastClickedGraph = null; });
55 Dygraph.addEvent(document,
"click", function() { lastClickedGraph = null; });
56 var g = new Dygraph(document.getElementById(
"div_g"),
57 NoisyData, { errorBars : true });
58 var s = document.getElementById(
"g2_console");
59 var g2 = new Dygraph(document.getElementById(
"div_g2"),
63 interactionModel: Dygraph.Interaction.nonInteractiveModel,
64 clickCallback: function(e, x, pts) {
65 s.innerHTML +=
"<b>Click</b> " + pts[
0].name +
": " + pts[
0].x +
"<br/>";
67 pointClickCallback: function(e, p) {
68 s.innerHTML +=
"<b>Point Click</b> " + p.name +
": " + p.x +
"<br/>";
71 var g3 = new Dygraph(document.getElementById(
"div_g3"),
72 NoisyData, { errorBars : true, interactionModel : {
77 'dblclick' : dblClickV3,
78 'mousewheel' : scrollV3
80 var g4 = new Dygraph(document.getElementById(
"div_g4"),
81 NoisyData, { errorBars : true, drawPoints : true, interactionModel : {
85 'dblclick' : dblClickV4,
87 underlayCallback : captureCanvas