diff --git a/examples/index.html b/examples/index.html index 36ae0a1..b7ad541 100644 --- a/examples/index.html +++ b/examples/index.html @@ -20,7 +20,7 @@
  • Selection support and zooming and zooming with overview
  • Plotting time series and visitors per day with zooming and weekends
  • Dual axis support
  • -
  • Interacting with the data
  • +
  • Interacting with the data and tracking curves with crosshair
  • diff --git a/examples/tracking.html b/examples/tracking.html index 0bbb09d..ba74ebc 100644 --- a/examples/tracking.html +++ b/examples/tracking.html @@ -31,20 +31,26 @@ $(function () { } var plot = $.plot($("#placeholder"), - [ { data: sin, label: "sin(x)"}, { data: cos, label: "cos(x)" } ], + [ { data: sin, label: "sin(x) = -0.00"}, { data: cos, label: "cos(x) = -0.00" } ], { lines: { show: true }, crosshair: { mode: "x" }, grid: { hoverable: true, autoHighlight: false }, yaxis: { min: -1.2, max: 1.2 } }); - var legends = $("#placeholder .legendLabel"); legends.each(function () { // fix the widths so they don't jump around - $(this).css('width', $(this).width() + 30); + $(this).css('width', $(this).width()); }); + + var updateLegendTimeout = null; + var latestPosition = null; - $("#placeholder").bind("plothover", function (event, pos, item) { + function updateLegend() { + updateLegendTimeout = null; + + var pos = latestPosition; + var axes = plot.getAxes(); if (pos.x < axes.xaxis.min || pos.x > axes.xaxis.max || pos.y < axes.yaxis.min || pos.y > axes.yaxis.max) @@ -68,8 +74,14 @@ $(function () { else y = p1[1] + (p2[1] - p1[1]) * (pos.x - p1[0]) / (p2[0] - p1[0]); - legends.eq(i).text(series.label + " = " + y.toFixed(2)); + legends.eq(i).text(series.label.replace(/=.*/, "= " + y.toFixed(2))); } + } + + $("#placeholder").bind("plothover", function (event, pos, item) { + latestPosition = pos; + if (!updateLegendTimeout) + updateLegendTimeout = setTimeout(updateLegend, 50); }); }); diff --git a/jquery.flot.js b/jquery.flot.js index 56f06de..251634f 100644 --- a/jquery.flot.js +++ b/jquery.flot.js @@ -870,8 +870,8 @@ } // draw markings - if (options.grid.markings) { - var markings = options.grid.markings; + var markings = options.grid.markings; + if (markings) { if ($.isFunction(markings)) // xmin etc. are backwards-compatible, to be removed in future markings = markings({ xmin: axes.xaxis.min, xmax: axes.xaxis.max, ymin: axes.yaxis.min, ymax: axes.yaxis.max, xaxis: axes.xaxis, yaxis: axes.yaxis, x2axis: axes.x2axis, y2axis: axes.y2axis }); @@ -1752,7 +1752,7 @@ function triggerRedrawOverlay() { if (!redrawTimeout) - redrawTimeout = setTimeout(redrawOverlay, 50); + redrawTimeout = setTimeout(redrawOverlay, 30); } function redrawOverlay() {