diff --git a/public/app/plugins/panel/graph/graph_tooltip.js b/public/app/plugins/panel/graph/graph_tooltip.js index 318b296bc02..1de99c42da7 100644 --- a/public/app/plugins/panel/graph/graph_tooltip.js +++ b/public/app/plugins/panel/graph/graph_tooltip.js @@ -34,13 +34,22 @@ function ($, core) { }; this.findHoverIndexFromData = function(posX, series) { - var len = series.data.length; - for (var j = 0; j < len; j++) { - if (series.data[j][0] > posX) { - return Math.max(j - 1, 0); + var lower = 0; + var upper = series.data.length - 1; + var middle; + while (true) { + if (lower > upper) { + return Math.max(upper, 0); + } + middle = Math.floor((lower + upper) / 2); + if (series.data[middle][0] === posX) { + return middle; + } else if (series.data[middle][0] < posX) { + lower = middle + 1; + } else { + upper = middle - 1; } } - return j - 1; }; this.renderAndShow = function(absoluteTime, innerHtml, pos, xMode) { @@ -156,6 +165,7 @@ function ($, core) { this.clear = function(plot) { $tooltip.detach(); plot.clearCrosshair(); + plot.unhighlight(); }; this.show = function(pos, item) { @@ -171,12 +181,17 @@ function ($, core) { // get pageX from position on x axis and pageY from relative position in original panel if (pos.panelRelY) { var pointOffset = plot.pointOffset({x: pos.x}); - if (Number.isNaN(pointOffset.left) || pointOffset.left < 0) { - $tooltip.detach(); + if (Number.isNaN(pointOffset.left) || pointOffset.left < 0 || pointOffset.left > elem.width()) { + self.clear(plot); return; } pos.pageX = elem.offset().left + pointOffset.left; pos.pageY = elem.offset().top + elem.height() * pos.panelRelY; + var isVisible = pos.pageY >= $(window).scrollTop() && pos.pageY <= $(window).innerHeight() + $(window).scrollTop(); + if (!isVisible) { + self.clear(plot); + return; + } plot.setCrosshair(pos); allSeriesMode = true; diff --git a/public/app/plugins/panel/graph/specs/tooltip_specs.ts b/public/app/plugins/panel/graph/specs/tooltip_specs.ts index 58177ea7a16..e4436c0f52d 100644 --- a/public/app/plugins/panel/graph/specs/tooltip_specs.ts +++ b/public/app/plugins/panel/graph/specs/tooltip_specs.ts @@ -40,6 +40,31 @@ function describeSharedTooltip(desc, fn) { }); } +describe("findHoverIndexFromData", function() { + var tooltip = new GraphTooltip(elem, dashboard, scope); + var series = { data: [[100, 0], [101, 0], [102, 0], [103, 0], [104, 0], [105, 0], [106, 0], [107, 0]] }; + + it("should return 0 if posX out of lower bounds", function() { + var posX = 99; + expect(tooltip.findHoverIndexFromData(posX, series)).to.be(0); + }); + + it("should return n - 1 if posX out of upper bounds", function() { + var posX = 108; + expect(tooltip.findHoverIndexFromData(posX, series)).to.be(series.data.length - 1); + }); + + it("should return i if posX in series", function() { + var posX = 104; + expect(tooltip.findHoverIndexFromData(posX, series)).to.be(4); + }); + + it("should return i if posX not in series and i + 1 > posX", function() { + var posX = 104.9; + expect(tooltip.findHoverIndexFromData(posX, series)).to.be(4); + }); +}); + describeSharedTooltip("steppedLine false, stack false", function(ctx) { ctx.setup(function() { ctx.data = [ @@ -168,6 +193,3 @@ describeSharedTooltip("steppedLine false, stack true, individual true", function expect(ctx.results[1].value).to.be(2); }); }); - - -