1 files changed, 51 insertions, 42 deletions

diff --git a/jquery.flot.crosshair.js b/jquery.flot.crosshair.js
index 1d433f0..c5df9d9 100644
--- a/jquery.flot.crosshair.js
+++ b/jquery.flot.crosshair.js
@@ -1,29 +1,31 @@
-/*
-Flot plugin for showing crosshairs, thin lines, when the mouse hovers
-over the plot.
-
-  crosshair: {
-    mode: null or "x" or "y" or "xy"
-    color: color
-    lineWidth: number
-  }
-
-Set the mode to one of "x", "y" or "xy". The "x" mode enables a
-vertical crosshair that lets you trace the values on the x axis, "y"
-enables a horizontal crosshair and "xy" enables them both. "color" is
-the color of the crosshair (default is "rgba(170, 0, 0, 0.80)"),
-"lineWidth" is the width of the drawn lines (default is 1).
+/* Flot plugin for showing crosshairs when the mouse hovers over the plot.
+
+Copyright (c) 2007-2013 IOLA and Ole Laursen.
+Licensed under the MIT license.
+
+The plugin supports these options:
+
+	crosshair: {
+		mode: null or "x" or "y" or "xy"
+		color: color
+		lineWidth: number
+	}
+
+Set the mode to one of "x", "y" or "xy". The "x" mode enables a vertical
+crosshair that lets you trace the values on the x axis, "y" enables a
+horizontal crosshair and "xy" enables them both. "color" is the color of the
+crosshair (default is "rgba(170, 0, 0, 0.80)"), "lineWidth" is the width of
+the drawn lines (default is 1).
 
 The plugin also adds four public methods:
 
-  - setCrosshair(pos)
+  - setCrosshair( pos )
 
-    Set the position of the crosshair. Note that this is cleared if
-    the user moves the mouse. "pos" is in coordinates of the plot and
-    should be on the form { x: xpos, y: ypos } (you can use x2/x3/...
-    if you're using multiple axes), which is coincidentally the same
-    format as what you get from a "plothover" event. If "pos" is null,
-    the crosshair is cleared.
+    Set the position of the crosshair. Note that this is cleared if the user
+    moves the mouse. "pos" is in coordinates of the plot and should be on the
+    form { x: xpos, y: ypos } (you can use x2/x3/... if you're using multiple
+    axes), which is coincidentally the same format as what you get from a
+    "plothover" event. If "pos" is null, the crosshair is cleared.
 
   - clearCrosshair()
 
@@ -31,22 +33,25 @@ The plugin also adds four public methods:
 
   - lockCrosshair(pos)
 
-    Cause the crosshair to lock to the current location, no longer
-    updating if the user moves the mouse. Optionally supply a position
-    (passed on to setCrosshair()) to move it to.
+    Cause the crosshair to lock to the current location, no longer updating if
+    the user moves the mouse. Optionally supply a position (passed on to
+    setCrosshair()) to move it to.
 
     Example usage:
-      var myFlot = $.plot( $("#graph"), ..., { crosshair: { mode: "x" } } };
-      $("#graph").bind("plothover", function (evt, position, item) {
-        if (item) {
-          // Lock the crosshair to the data point being hovered
-          myFlot.lockCrosshair({ x: item.datapoint[0], y: item.datapoint[1] });
-        }
-        else {
-          // Return normal crosshair operation
-          myFlot.unlockCrosshair();
-        }
-      });
+
+	var myFlot = $.plot( $("#graph"), ..., { crosshair: { mode: "x" } } };
+	$("#graph").bind( "plothover", function ( evt, position, item ) {
+		if ( item ) {
+			// Lock the crosshair to the data point being hovered
+			myFlot.lockCrosshair({
+				x: item.datapoint[ 0 ],
+				y: item.datapoint[ 1 ]
+			});
+		} else {
+			// Return normal crosshair operation
+			myFlot.unlockCrosshair();
+		}
+	});
 
   - unlockCrosshair()
 
@@ -84,11 +89,11 @@ The plugin also adds four public methods:
             if (pos)
                 plot.setCrosshair(pos);
             crosshair.locked = true;
-        }
+        };
 
         plot.unlockCrosshair = function unlockCrosshair() {
             crosshair.locked = false;
-        }
+        };
 
         function onMouseOut(e) {
             if (crosshair.locked)
@@ -134,18 +139,22 @@ The plugin also adds four public methods:
             ctx.translate(plotOffset.left, plotOffset.top);
 
             if (crosshair.x != -1) {
+                var adj = plot.getOptions().crosshair.lineWidth % 2 === 0 ? 0 : 0.5;
+
                 ctx.strokeStyle = c.color;
                 ctx.lineWidth = c.lineWidth;
                 ctx.lineJoin = "round";
 
                 ctx.beginPath();
                 if (c.mode.indexOf("x") != -1) {
-                    ctx.moveTo(crosshair.x, 0);
-                    ctx.lineTo(crosshair.x, plot.height());
+                    var drawX = Math.round(crosshair.x) + adj;
+                    ctx.moveTo(drawX, 0);
+                    ctx.lineTo(drawX, plot.height());
                 }
                 if (c.mode.indexOf("y") != -1) {
-                    ctx.moveTo(0, crosshair.y);
-                    ctx.lineTo(plot.width(), crosshair.y);
+                    var drawY = Math.round(crosshair.y) + adj;
+                    ctx.moveTo(0, drawY);
+                    ctx.lineTo(plot.width(), drawY);
                 }
                 ctx.stroke();
             }