--- a/myway/myway_timeliness_stop.php
+++ b/myway/myway_timeliness_stop.php
@@ -17,10 +17,10 @@
 include ('../include/common.inc.php');
 include_header("MyWay Deltas", "mywayDelta");
 ?>
-
-    <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../js/flot/excanvas.min.js"></script><![endif]--> 
-
-<script language="javascript" type="text/javascript" src="../js/flot/jquery.flot.js"></script> 
+<!--[if lt IE 9]>
+    <script type="text/javascript" src="../js/FlashCanvas/bin/flashcanvas.js"></script>
+    <![endif]-->
+    <script type="text/javascript" src="../js/flotr2/flotr2.min.js"></script>
 <form method="get" action="">
     <select id="stopid" name="stopid">
         <?php
@@ -41,8 +41,7 @@
             d.setUTCMinutes(0);
             d.setUTCHours(0);
             var midnight = d.getTime();
-
-            var placeholder = $("#placeholder");
+        var placeholder = document.getElementById("placeholder");
             var data = [];
             var options = {
                 xaxis: {
@@ -51,19 +50,12 @@
                 yaxis: {
                     tickFormatter: yformatter
                 },
-                grid: { hoverable: true, clickable: true, labelMargin: 32   },
-                series: {
-                    lines: { show: false },
-                    points: { show: true }
-                }
+            mouse: { track: true, relative: true, trackFormatter: showTooltip}
+       
             };
 
-            var plot = $.plot(placeholder, data, options);
-            var o;
-            o = plot.pointOffset({ x: midnight+ (9*60*60*1000), y: -1.2});
-            placeholder.append('<div style="position:absolute;left:' + (o.left + 4) + 'px;top:' + o.top + 'px;color:#666;font-size:smaller">9am</div>');
-            o = plot.pointOffset({ x: midnight+ (16*60*60*1000), y: -1.2});
-            placeholder.append('<div style="position:absolute;left:' + (o.left + 4) + 'px;top:' + o.top + 'px;color:#666;font-size:smaller">4pm</div>');
+           
+            Flotr.draw(placeholder,  data, options);   
             // fetch one series, adding to what we got
             var alreadyFetched = {};
     
@@ -75,11 +67,7 @@
                 var dataurl = "myway_timeliness_stop.json.php?stopid=" + select.val();
                 // then fetch the data with jQuery
                 function onDataReceived(series) {
-                    // extract the first coordinate pair so you can see that
-                    // data is now an ordinary Javascript object
-                    var firstcoordinate = '(' + series.data[0][0] + ', ' + series.data[0][1] + ')';
- 
-      
+           
                     // let's add it to our current data
                     if (!alreadyFetched[series.label]) {
                         alreadyFetched[series.label] = true;
@@ -87,8 +75,9 @@
                     }
             
                     // and plot all we got
-                    $.plot(placeholder, data, options);
-                }
+            
+            Flotr.draw(placeholder,  data, options);
+        }
         
                 $.ajax({
                     url: dataurl,
@@ -103,46 +92,16 @@
             if (Math.floor(v/60) < -9) return "";
             return Math.abs(Math.floor(v/60)) + " min " + (v == 0 ? "" : (v >0 ? "early":"late"))
         }
-        function showTooltip(x, y, contents) {
-            $('<div id="tooltip">' + contents + '</div>').css( {
-                position: 'absolute',
-                display: 'none',
-                top: y + 5,
-                left: x + 5,
-                border: '1px solid #fdd',
-                padding: '2px',
-                'background-color': '#fee',
-                opacity: 0.80
-            }).appendTo("body").fadeIn(200);
-        }
- 
-        var previousPoint = null;
-        $("#placeholder").bind("plothover", function (event, pos, item) {
-            $("#x").text(pos.x.toFixed(2));
-            $("#y").text(pos.y.toFixed(2));
- 
-            if (item) {
-                if (previousPoint != item.dataIndex) {
-                    previousPoint = item.dataIndex;
-                    
-                    $("#tooltip").remove();
-                    var x = item.datapoint[0].toFixed(2),
-                    y = item.datapoint[1].toFixed(2);
-                    
-                    var d = new Date();
-                    d.setTime(x);
-                    var time = d.getUTCHours() +':'+ (d.getUTCMinutes().toString().length == 1 ? '0'+ d.getMinutes():  d.getUTCMinutes())
+      function showTooltip(point) {
 
                     
-                    showTooltip(item.pageX, item.pageY,
-                    item.series.label + " at "+ time +" = " + Math.abs(new Number(y/60).toFixed(2))+" minutes "+(y >0 ? "early":"late"));
-                }
-            }
-            else {
-                $("#tooltip").remove();
-                previousPoint = null;            
-            }
-        });
+                var d = new Date();
+                d.setTime(point.x);
+                var time = d.getUTCHours() +':'+ (d.getUTCMinutes().toString().length == 1 ? '0'+ d.getMinutes():  d.getUTCMinutes())
+
+                    
+                return  point.series.label + " at "+ time +" = " + Math.abs(new Number(point.y/60).toFixed(2))+" minutes "+(point.y >0 ? "early":"late");
+    }
 
     </script>