Merge pull request #3040 from plotly/polar-hover-text-fix

Polar 'text' in hover labels fixes

Author: etpinard

src/traces/barpolar/hover.js

@@ -11,6 +11,7 @@
 var Fx = require('../../components/fx');
 var Lib = require('../../lib');
 var getTraceColor = require('../bar/hover').getTraceColor;
+var fillHoverText = require('../scatter/fill_hover_text');
 var makeHoverPointText = require('../scatterpolar/hover').makeHoverPointText;
 var isPtInsidePolygon = require('../../plots/polar/helpers').isPtInsidePolygon;
 
@@ -58,7 +59,8 @@ module.exports = function hoverPoints(pointData, xval, yval) {
     pointData.y0 = pointData.y1 = cdi.ct[1];
 
     var _cdi = Lib.extendFlat({}, cdi, {r: cdi.s, theta: cdi.p});
-    pointData.extraText = makeHoverPointText(_cdi, trace, subplot);
+    fillHoverText(cdi, trace, pointData);
+    makeHoverPointText(_cdi, trace, subplot, pointData);
     pointData.color = getTraceColor(trace, cdi);
     pointData.xLabelVal = pointData.yLabelVal = undefined;
 

src/traces/scatterpolar/hover.js

@@ -31,12 +31,12 @@ function hoverPoints(pointData, xval, yval, hovermode) {
 
     newPointData.xLabelVal = undefined;
     newPointData.yLabelVal = undefined;
-    newPointData.extraText = makeHoverPointText(cdi, trace, subplot);
+    makeHoverPointText(cdi, trace, subplot, newPointData);
 
     return scatterPointData;
 }
 
-function makeHoverPointText(cdi, trace, subplot) {
+function makeHoverPointText(cdi, trace, subplot, pointData) {
     var radialAxis = subplot.radialAxis;
     var angularAxis = subplot.angularAxis;
     var hoverinfo = cdi.hi || trace.hoverinfo;
@@ -50,7 +50,7 @@ function makeHoverPointText(cdi, trace, subplot) {
         text.push(ax._hovertitle + ': ' + Axes.tickText(ax, val, 'hover').text);
     }
 
-    if(parts.indexOf('all') !== -1) parts = ['r', 'theta'];
+    if(parts.indexOf('all') !== -1) parts = ['r', 'theta', 'text'];
     if(parts.indexOf('r') !== -1) {
         textPart(radialAxis, radialAxis.c2l(cdi.r));
     }
@@ -61,8 +61,12 @@ function makeHoverPointText(cdi, trace, subplot) {
             angularAxis.thetaunit === 'degrees' ? Lib.rad2deg(theta) : theta
         );
     }
+    if(parts.indexOf('text') !== -1 && pointData.text) {
+        text.push(pointData.text);
+        delete pointData.text;
+    }
 
-    return text.join('<br>');
+    pointData.extraText = text.join('<br>');
 }
 
 module.exports = {

src/traces/scatterpolargl/index.js

@@ -165,7 +165,7 @@ function hoverPoints(pointData, xval, yval, hovermode) {
 
     newPointData.xLabelVal = undefined;
     newPointData.yLabelVal = undefined;
-    newPointData.extraText = makeHoverPointText(cdi, trace, subplot);
+    makeHoverPointText(cdi, trace, subplot, newPointData);
 
     return scatterPointData;
 }

test/jasmine/tests/barpolar_test.js

@@ -115,6 +115,38 @@ describe('Test barpolar hover:', function() {
             extraText: 'r: 1<br>θ: 0°',
             color: '#1f77b4'
         }
+    }, {
+        desc: 'with custom text scalar',
+        traces: [{
+            r: [1, 2, 3],
+            theta: [0, 90, 180],
+            text: 'TEXT'
+        }],
+        xval: 1,
+        yval: 0,
+        exp: {
+            index: 0,
+            x: 263.33,
+            y: 200,
+            extraText: 'r: 1<br>θ: 0°<br>TEXT',
+            color: '#1f77b4'
+        }
+    }, {
+        desc: 'with custom text array',
+        traces: [{
+            r: [1, 2, 3],
+            theta: [0, 90, 180],
+            text: ['A', 'B', 'C']
+        }],
+        xval: 1,
+        yval: 0,
+        exp: {
+            index: 0,
+            x: 263.33,
+            y: 200,
+            extraText: 'r: 1<br>θ: 0°<br>A',
+            color: '#1f77b4'
+        }
     }, {
         desc: 'works with bars with offsets',
         traces: [{

test/jasmine/tests/scatterpolar_test.js

@@ -158,6 +158,22 @@ describe('Test scatterpolar hover:', function() {
         },
         nums: 'r: 1.108937\nθ: 115.4969°',
         name: 'Trial 3'
+    }, {
+        desc: 'with custom text scalar',
+        patch: function(fig) {
+            fig.data.forEach(function(t) { t.text = 'a'; });
+            return fig;
+        },
+        nums: 'r: 4.022892\nθ: 128.342°\na',
+        name: 'Trial 3'
+    }, {
+        desc: 'with custom text array',
+        patch: function(fig) {
+            fig.data.forEach(function(t) { t.text = t.r.map(String); });
+            return fig;
+        },
+        nums: 'r: 4.022892\nθ: 128.342°\n4.02289202968',
+        name: 'Trial 3'
     }]
     .forEach(function(specs) {
         it('should generate correct hover labels ' + specs.desc, function(done) {

test/jasmine/tests/scatterpolargl_test.js

@@ -79,6 +79,22 @@ describe('Test scatterpolargl hover:', function() {
         pos: [470, 80],
         nums: 'r: 4\nθ: d',
         name: 'angular cate...'
+    }, {
+        desc: 'with custom text scalar',
+        patch: function(fig) {
+            fig.data.forEach(function(t) { t.text = 'a'; });
+            return fig;
+        },
+        nums: 'r: 3.886013\nθ: 125.2822°\na',
+        name: 'Trial 3'
+    }, {
+        desc: 'with custom text array',
+        patch: function(fig) {
+            fig.data.forEach(function(t) { t.text = t.r.map(String); });
+            return fig;
+        },
+        nums: 'r: 3.886013\nθ: 125.2822°\n3.88601339194',
+        name: 'Trial 3'
     }]
     .forEach(function(specs) {
         it('should generate correct hover labels ' + specs.desc, function(done) {