Improvements to graph - allow interactive pan & zoom

timlinux · timlinux · commit 0589dafe4816 · 2011-11-21T20:14:27.000+02:00
diff --git a/resources/html/chart.html b/resources/html/chart.html
@@ -6,27 +6,33 @@
     <script language="javascript" type="text/javascript" src="../js/jquery.flot.js"></script>
     <!-- flot grow plugin: see http://jumware.com/Includes/jquery/Flot/Doc/JQuery.flot.grow.html -->
     <script language="javascript" type="text/javascript" src="../js/jquery.flot.grow.js"></script>
+    <script language="javascript" type="text/javascript" src="../js/jquery.flot.navigate.js"></script>
   </head>
   <body>
     <div id="chart"><h1>Histogram loading...</h1></div>
     <script id="source" language="javascript" type="text/javascript">
       var d = new Array(); 
       function replot()
       {
-        var options = { series : { 
-                          grow   : { active   : true }, 
-                          points : { show     : true }, 
-                          grow   : { stepMode : "maximum", steps: 120 },
-                          lines  : { show     : true }
-                        } 
+        var options = { series : 
+                        { 
+                          grow   : { active      : true }, 
+                          points : { show        : true }, 
+                          grow   : { stepMode    : "maximum", steps: 120 },
+                          lines  : { show        : true },
+                        }, 
+                        yaxis  : { zoomRange: null, panRange: null },
+                        xaxis  : { zoomRange: null, panRange: null },
+                        zoom   : { interactive : true },
+                        pan    : { interactive : true }
                       };
         $.plot($("#chart"), d, options);
       }
       function addSeries( theSeries )
       {
         d.push( { data: theSeries } );
         replot();
-        alert( theSeries );
+        //alert( theSeries );
       }
       $(function () 
       {
