Merge pull request #5676 from plotly/mapbox-latlon

Provide latLon hover labels on scattermapbox and densitymapbox

Author: archmoj

src/traces/densitymapbox/hover.js

@@ -1,8 +1,8 @@
 'use strict';
 
-var Lib = require('../../lib');
 var Axes = require('../../plots/cartesian/axes');
-var scatterMapboxHoverPoints = require('../scattermapbox/hover');
+var scatterMapboxHoverPoints = require('../scattermapbox/hover').hoverPoints;
+var getExtraText = require('../scattermapbox/hover').getExtraText;
 
 module.exports = function hoverPoints(pointData, xval, yval) {
     var pts = scatterMapboxHoverPoints(pointData, xval, yval);
@@ -26,33 +26,3 @@ module.exports = function hoverPoints(pointData, xval, yval) {
 
     return [newPointData];
 };
-
-function getExtraText(trace, di, labels) {
-    if(trace.hovertemplate) return;
-
-    var hoverinfo = di.hi || trace.hoverinfo;
-    var parts = hoverinfo.split('+');
-    var isAll = parts.indexOf('all') !== -1;
-    var hasLon = parts.indexOf('lon') !== -1;
-    var hasLat = parts.indexOf('lat') !== -1;
-    var lonlat = di.lonlat;
-    var text = [];
-
-    function format(v) {
-        return v + '\u00B0';
-    }
-
-    if(isAll || (hasLon && hasLat)) {
-        text.push('(' + format(lonlat[0]) + ', ' + format(lonlat[1]) + ')');
-    } else if(hasLon) {
-        text.push(labels.lon + format(lonlat[0]));
-    } else if(hasLat) {
-        text.push(labels.lat + format(lonlat[1]));
-    }
-
-    if(isAll || parts.indexOf('text') !== -1) {
-        Lib.fillText(di, trace, text);
-    }
-
-    return text.join('<br>');
-}

src/traces/scattermapbox/hover.js

@@ -6,7 +6,7 @@ var getTraceColor = require('../scatter/get_trace_color');
 var fillText = Lib.fillText;
 var BADNUM = require('../../constants/numerical').BADNUM;
 
-module.exports = function hoverPoints(pointData, xval, yval) {
+function hoverPoints(pointData, xval, yval) {
     var cd = pointData.cd;
     var trace = cd[0].trace;
     var xa = pointData.xa;
@@ -66,7 +66,7 @@ module.exports = function hoverPoints(pointData, xval, yval) {
     pointData.hovertemplate = trace.hovertemplate;
 
     return [pointData];
-};
+}
 
 function getExtraText(trace, di, labels) {
     if(trace.hovertemplate) return;
@@ -86,7 +86,7 @@ function getExtraText(trace, di, labels) {
     }
 
     if(isAll || (hasLon && hasLat)) {
-        text.push('(' + format(lonlat[0]) + ', ' + format(lonlat[1]) + ')');
+        text.push('(' + format(lonlat[1]) + ', ' + format(lonlat[0]) + ')');
     } else if(hasLon) {
         text.push(labels.lon + format(lonlat[0]));
     } else if(hasLat) {
@@ -99,3 +99,8 @@ function getExtraText(trace, di, labels) {
 
     return text.join('<br>');
 }
+
+module.exports = {
+    hoverPoints: hoverPoints,
+    getExtraText: getExtraText
+};

src/traces/scattermapbox/index.js

@@ -7,7 +7,7 @@ module.exports = {
     formatLabels: require('./format_labels'),
     calc: require('../scattergeo/calc'),
     plot: require('./plot'),
-    hoverPoints: require('./hover'),
+    hoverPoints: require('./hover').hoverPoints,
     eventData: require('./event_data'),
     selectPoints: require('./select'),
 

test/jasmine/tests/densitymapbox_test.js

@@ -330,7 +330,7 @@ describe('Test densitymapbox hover:', function() {
 
     var specs = [{
         desc: 'basic',
-        nums: '3\n(20°, 25°)',
+        nums: '3\n(25°, 20°)',
         name: '',
         evtPts: [{lon: 20, lat: 25, z: 3, pointNumber: 1, curveNumber: 0}]
     }, {
@@ -352,7 +352,7 @@ describe('Test densitymapbox hover:', function() {
             });
             return fig;
         },
-        nums: '(20°, 25°)',
+        nums: '(25°, 20°)',
         name: 'trace 0',
         evtPts: [{lon: 20, lat: 25, z: 3, pointNumber: 1, curveNumber: 0}]
     }, {
@@ -363,7 +363,7 @@ describe('Test densitymapbox hover:', function() {
             });
             return fig;
         },
-        nums: '(20°, 25°)',
+        nums: '(25°, 20°)',
         name: '',
         evtPts: [{lon: 20, lat: 25, pointNumber: 1, curveNumber: 0}]
     }];

test/jasmine/tests/scattermapbox_test.js

@@ -731,7 +731,7 @@ describe('scattermapbox hover', function() {
         expect([out.x0, out.x1, out.y0, out.y1]).toBeCloseToArray([
             1122.33, 1124.33, 105.41, 107.41
         ]);
-        expect(out.extraText).toEqual('(300°, 10°)<br>D');
+        expect(out.extraText).toEqual('(10°, 300°)<br>D');
         expect(out.color).toEqual('#1f77b4');
     });