diff --git a/platform/features/plot/res/templates/plot.html b/platform/features/plot/res/templates/plot.html
index 2450639838..4d95150cab 100644
--- a/platform/features/plot/res/templates/plot.html
+++ b/platform/features/plot/res/templates/plot.html
@@ -16,8 +16,8 @@
- {{subplot.getHoverCoordinates().join(', ')}}
+ ng-if="subplot.isHovering() && subplot.getHoverCoordinates()">
+ {{subplot.getHoverCoordinates()}}
diff --git a/platform/features/plot/src/SubPlot.js b/platform/features/plot/src/SubPlot.js
index aa87164d20..7a9ebfc49b 100644
--- a/platform/features/plot/src/SubPlot.js
+++ b/platform/features/plot/src/SubPlot.js
@@ -33,6 +33,7 @@ define(
domainOffset,
mousePosition,
marqueeStart,
+ hoverCoordinates,
isHovering = false;
// Utility, for map/forEach loops. Index 0 is domain,
@@ -43,6 +44,11 @@ define(
formatter.formatDomainValue)(v);
}
+ // Utility function for filtering out empty strings.
+ function isNonEmpty(v) {
+ return typeof v === 'string' && v !== "";
+ }
+
// Converts from pixel coordinates to domain-range,
// to interpret mouse gestures.
function mousePositionToDomainRange(mousePosition) {
@@ -79,6 +85,16 @@ define(
return [ position[0] - domainOffset, position[1] ];
}
+
+ // Update the currnet hover coordinates
+ function updateHoverCoordinates() {
+ hoverCoordinates = mousePosition &&
+ mousePositionToDomainRange(mousePosition)
+ .map(formatValue)
+ .filter(isNonEmpty)
+ .join(", ");
+ }
+
// Update the drawable marquee area to reflect current
// mouse position (or don't show it at all, if no marquee
// zoom is in progress)
@@ -191,10 +207,7 @@ define(
* coordinates over which the mouse is hovered
*/
getHoverCoordinates: function () {
- return mousePosition ?
- mousePositionToDomainRange(
- mousePosition
- ).map(formatValue) : [];
+ return hoverCoordinates;
},
/**
* Handle mouse movement over the chart area.
@@ -203,6 +216,7 @@ define(
hover: function ($event) {
isHovering = true;
mousePosition = toMousePosition($event);
+ updateHoverCoordinates();
if (marqueeStart) {
updateMarqueeBox();
}
diff --git a/platform/features/plot/src/elements/PlotFormatter.js b/platform/features/plot/src/elements/PlotFormatter.js
index de6d02bb60..a3b7abe2dd 100644
--- a/platform/features/plot/src/elements/PlotFormatter.js
+++ b/platform/features/plot/src/elements/PlotFormatter.js
@@ -16,11 +16,11 @@ define(
*/
function PlotFormatter() {
function formatDomainValue(v) {
- return moment.utc(v).format(DATE_FORMAT);
+ return isNaN(v) ? "" : moment.utc(v).format(DATE_FORMAT);
}
function formatRangeValue(v) {
- return v.toFixed(1);
+ return isNaN(v) ? "" : v.toFixed(1);
}
return {
diff --git a/platform/features/plot/test/SubPlotSpec.js b/platform/features/plot/test/SubPlotSpec.js
index 3981142135..5f5393f433 100644
--- a/platform/features/plot/test/SubPlotSpec.js
+++ b/platform/features/plot/test/SubPlotSpec.js
@@ -84,13 +84,15 @@ define(
it("provides hovering coordinates", function () {
// Should be empty when not hovering
- expect(subplot.getHoverCoordinates()).toEqual([]);
+ expect(subplot.getHoverCoordinates())
+ .toBeUndefined();
// Start hovering
subplot.hover({ target: mockElement });
// Should now have coordinates to display
- expect(subplot.getHoverCoordinates().length).toEqual(2);
+ expect(subplot.getHoverCoordinates())
+ .toEqual(jasmine.any(String));
});
it("supports marquee zoom", function () {