add 'hovertext' to scatter3d traces

Author: etpinard

src/traces/scatter3d/attributes.js

@@ -72,9 +72,22 @@ 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 (x,y,z) coordinates.'
+            'this trace\'s (x,y,z) 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 text elements associated with each (x,y,z) triplet.',
+            '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 (x,y,z) coordinates.',
+            'To be seen, trace `hoverinfo` must contain a *text* flag.'
+        ].join(' ')
+    }),
+
     mode: extendFlat({}, scatterAttrs.mode,  // shouldn't this be on-par with 2D?
         {dflt: 'lines+markers'}),
     surfaceaxis: {

src/traces/scatter3d/convert.js

@@ -58,8 +58,12 @@ proto.handlePick = function(selection) {
             selection.object = this.scatterPlot;
             this.scatterPlot.highlight(selection.data);
         }
-        if(this.textLabels && this.textLabels[selection.data.index] !== undefined) {
-            selection.textLabel = this.textLabels[selection.data.index];
+        if(this.textLabels) {
+            if(this.textLabels[selection.data.index] !== undefined) {
+                selection.textLabel = this.textLabels[selection.data.index];
+            } else {
+                selection.textLabel = this.textLabels;
+            }
         }
         else selection.textLabel = '';
 
@@ -371,7 +375,7 @@ proto.update = function(data) {
         opacity: data.opacity
     };
 
-    this.textLabels = options.text;
+    this.textLabels = data.hovertext || data.text;
 
     if(this.mode.indexOf('text') !== -1) {
         if(this.textMarkers) this.textMarkers.update(textOptions);

src/traces/scatter3d/defaults.js

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

test/jasmine/tests/gl_plot_interact_test.js

@@ -46,14 +46,18 @@ describe('Test gl3d plots', function() {
         mouseEvent(type, 605, 271, opts);
     }
 
-    function assertHoverText(xLabel, yLabel, zLabel) {
+    function assertHoverText(xLabel, yLabel, zLabel, textLabel) {
         var node = d3.selectAll('g.hovertext');
         expect(node.size()).toEqual(1, 'hover text group');
 
         var tspan = d3.selectAll('g.hovertext').selectAll('tspan')[0];
         expect(tspan[0].innerHTML).toEqual(xLabel, 'x val');
         expect(tspan[1].innerHTML).toEqual(yLabel, 'y val');
         expect(tspan[2].innerHTML).toEqual(zLabel, 'z val');
+
+        if(textLabel) {
+            expect(tspan[3].innerHTML).toEqual(textLabel, 'text label');
+        }
     }
 
     function assertEventData(x, y, z, curveNumber, pointNumber) {
@@ -132,6 +136,18 @@ describe('Test gl3d plots', function() {
         .then(_hover)
         .then(function() {
             assertHoverText('x: 二 6, 2017', 'y: c', 'z: 100k');
+
+            return Plotly.restyle(gd, 'text', [['A', 'B', 'C', 'D']]);
+        })
+        .then(_hover)
+        .then(function() {
+            assertHoverText('x: 二 6, 2017', 'y: c', 'z: 100k', 'C');
+
+            return Plotly.restyle(gd, 'hovertext', [['Apple', 'Banana', 'Clementine', 'Dragon fruit']]);
+        })
+        .then(_hover)
+        .then(function() {
+            assertHoverText('x: 二 6, 2017', 'y: c', 'z: 100k', 'Clementine');
         })
         .then(done);