add 'hoverinfo' to scattermapbox traces

Author: etpinard

src/traces/scattermapbox/attributes.js

@@ -43,7 +43,19 @@ module.exports = {
             'If a single string, the same string appears over',
             'all the data points.',
             'If an array of string, the items are mapped in order to the',
-            'this trace\'s (lon,lat) coordinates.'
+            'this trace\'s (lon,lat) coordinates.',
+            'If trace `hoverinfo` contains a *text* flag and *hovertext* is not set,',
+            'these elements will be seen in the hover labels.'
+        ].join(' ')
+    }),
+    hovertext: extendFlat({}, scatterAttrs.hovertext, {
+        description: [
+            'Sets hover text elements associated with each (lon,lat) pair',
+            'If a single string, the same string appears over',
+            'all the data points.',
+            'If an array of string, the items are mapped in order to the',
+            'this trace\'s (lon,lat) coordinates.',
+            'To be seen, trace `hoverinfo` must contain a *text* flag.'
         ].join(' ')
     }),
 

src/traces/scattermapbox/calc.js

@@ -27,7 +27,8 @@ module.exports = function calc(gd, trace) {
         hasColorArray = (hasMarkers && Array.isArray(marker.color)),
         hasSizeArray = (hasMarkers && Array.isArray(marker.size)),
         hasSymbolArray = (hasMarkers && Array.isArray(marker.symbol)),
-        hasTextArray = Array.isArray(trace.text);
+        hasTextArray = Array.isArray(trace.text),
+        hasHoverTextArray = Array.isArray(trace.hovertext);
 
     calcMarkerColorscale(trace);
 
@@ -94,6 +95,11 @@ module.exports = function calc(gd, trace) {
             calcPt.tx = (typeof tx === 'string') ? tx : '';
         }
 
+        if(hasHoverTextArray) {
+            var htx = trace.hovertext[i];
+            calcPt.htx = (typeof htx === 'string') ? htx : '';
+        }
+
         calcTrace.push(calcPt);
     }
 

src/traces/scattermapbox/defaults.js

@@ -42,6 +42,7 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
     }
 
     coerce('text');
+    coerce('hovertext');
     coerce('mode');
 
     if(subTypes.hasLines(traceOut)) {

src/traces/scattermapbox/hover.js

@@ -86,7 +86,13 @@ function getExtraText(trace, di) {
     else if(hasLat) text.push('lat: ' + format(lonlat[1]));
 
     if(isAll || hoverinfo.indexOf('text') !== -1) {
-        var tx = di.tx || trace.text;
+        var tx;
+
+        if(di.htx) tx = di.htx;
+        else if(trace.hovertext) tx = trace.hovertext;
+        else if(di.tx) tx = di.tx;
+        else if(trace.text) tx = trace.text;
+
         if(!Array.isArray(tx)) text.push(tx);
     }
 

test/jasmine/tests/scattermapbox_test.js

@@ -588,7 +588,7 @@ describe('@noCI scattermapbox hover', function() {
         });
     });
 
-    it('should generate hover label info (hoverinfo: \'text\' case)', function(done) {
+    it('should generate hover label info (hoverinfo: \'text\' + \'text\' array case)', function(done) {
         Plotly.restyle(gd, 'hoverinfo', 'text').then(function() {
             var xval = 11,
                 yval = 11;
@@ -599,4 +599,16 @@ describe('@noCI scattermapbox hover', function() {
             done();
         });
     });
+
+    it('should generate hover label info (hoverinfo: \'text\' + \'hovertext\' array case)', function(done) {
+        Plotly.restyle(gd, 'hovertext', ['Apple', 'Banana', 'Orange']).then(function() {
+            var xval = 11,
+                yval = 11;
+
+            var out = hoverPoints(getPointData(gd), xval, yval)[0];
+
+            expect(out.extraText).toEqual('Apple');
+            done();
+        });
+    });
 });