fix texttemplate formatting for scatter{polar,geo,ternary,carpet}

... by calling `_module.formatLabels` during Drawing.textPointStyle.

    This way, prefixes and suffixes render correctly in texttemplate
    text and minus signs now show up correctly.

Author: etpinard

src/components/drawing/index.js

@@ -26,9 +26,9 @@ var DESELECTDIM = require('../../constants/interactions').DESELECTDIM;
 
 var subTypes = require('../../traces/scatter/subtypes');
 var makeBubbleSizeFn = require('../../traces/scatter/make_bubble_size_func');
+var appendArrayPointValue = require('../../components/fx/helpers').appendArrayPointValue;
 
 var drawing = module.exports = {};
-var appendArrayPointValue = require('../fx/helpers').appendArrayPointValue;
 
 // -----------------------------------------------------
 // styling functions for plot elements
@@ -684,27 +684,32 @@ drawing.textPointStyle = function(s, trace, gd) {
     if(!s.size()) return;
 
     var selectedTextColorFn;
-
     if(trace.selectedpoints) {
         var fns = drawing.makeSelectedTextStyleFns(trace);
         selectedTextColorFn = fns.selectedTextColorFn;
     }
 
-    var template = trace.texttemplate;
+    var texttemplate = trace.texttemplate;
+    var fullLayout = gd._fullLayout;
 
     s.each(function(d) {
         var p = d3.select(this);
-        var text = Lib.extractOption(d, trace, template ? 'txt' : 'tx', template ? 'texttemplate' : 'text');
+
+        var text = texttemplate ?
+            Lib.extractOption(d, trace, 'txt', 'texttemplate') :
+            Lib.extractOption(d, trace, 'tx', 'text');
 
         if(!text && text !== 0) {
             p.remove();
             return;
         }
 
-        if(template) {
-            var pt = {};
-            appendArrayPointValue(pt, trace, d.i);
-            text = Lib.texttemplateString(text, {}, gd._fullLayout._d3locale, pt, d, trace._meta || {});
+        if(texttemplate) {
+            var labels = trace._module.formatLabels ? trace._module.formatLabels(d, trace, fullLayout) : {};
+            var pointValues = {};
+            appendArrayPointValue(pointValues, trace, d.i);
+            var meta = trace._meta || {};
+            text = Lib.texttemplateString(text, labels, fullLayout._d3locale, pointValues, d, meta);
         }
 
         var pos = d.tp || trace.textposition;

test/jasmine/tests/carpet_test.js

@@ -730,7 +730,8 @@ describe('scattercarpet texttemplates', function() {
         'b': [1, 2, 3],
         'y': [[1, 2.2, 3], [1.5, 2.7, 3.5], [1.7, 2.9, 3.7]]
     }], 'g.textpoint', [
-        ['%{text}: %{a:0.1f}, %{b:0.1f}', ['A: 0.1, 1.5', 'B: 0.1, 1.5', 'C: 0.3, 1.5']]
+        ['%{text}: %{a:0.1f}, %{b:0.1f}', ['A: 0.1, 1.5', 'B: 0.1, 1.5', 'C: 0.3, 1.5']],
+        ['%{y}', ['1.000', '1.000', '2.200']]
     ]);
 });
 describe('contourcarpet plotting & editing', function() {

test/jasmine/tests/scatter_test.js

@@ -1239,7 +1239,9 @@ describe('end-to-end scatter tests', function() {
         .catch(failTest)
         .then(done);
     });
+});
 
+describe('Text templates on scatter traces:', function() {
     checkTextTemplate([{
         type: 'scatter',
         mode: 'markers+lines+text',
@@ -1249,6 +1251,21 @@ describe('end-to-end scatter tests', function() {
       ['%{y}', ['1', '5', '3', '2']],
       [['%{y}', '%{x}-%{y}'], ['1', '1-5', '', '']]
     ]);
+
+    checkTextTemplate({
+        data: [{
+            type: 'scatter',
+            mode: 'text',
+            x: ['a', 'b'],
+            y: ['1000', '1200']
+        }],
+        layout: {
+            xaxis: { tickprefix: '*', ticksuffix: '*' },
+            yaxis: { tickprefix: '$', ticksuffix: ' !', tickformat: '.2f'}
+        }
+    }, '.textpoint', [
+        ['%{x} is %{y}', ['*a* is $1000.00 !', '*b* is $1200.00 !']]
+    ]);
 });
 
 describe('stacked area', function() {

test/jasmine/tests/scattergeo_test.js

@@ -446,7 +446,7 @@ describe('Test scattergeo texttemplate:', function() {
         'lat': [45.5, 43.4, 49.13],
         'text': ['Montreal', 'Toronto', 'Vancouver']
     }], '.scattergeo text', [
-        ['%{text}: %{lon}, %{lat}', ['Montreal: -73.57, 45.5', 'Toronto: -79.24, 43.4', 'Vancouver: -123.06, 49.13']]
+        ['%{text}: %{lon}, %{lat}', ['Montreal: −73.57, 45.5', 'Toronto: −79.24, 43.4', 'Vancouver: −123.06, 49.13']]
     ]);
 
     checkTextTemplate([{

test/jasmine/tests/scatterpolar_test.js

@@ -212,4 +212,21 @@ describe('Test scatterpolar texttemplate:', function() {
         ['%{text}: (%{r:0.2f}, %{theta:0.1f})', ['A: (1.00, 0.0)', 'B: (0.50, 90.0)', 'C: (1.00, 180.0)']],
         [['', 'b%{theta:0.2f}', '%{theta:0.2f}'], ['', 'b90.00', '180.00']]
     ]);
+
+    checkTextTemplate({
+        data: [{
+            type: 'scatterpolar',
+            mode: 'text',
+            theta: ['a', 'b'],
+            r: ['1000', '1200']
+        }],
+        layout: {
+            polar: {
+                radialaxis: { tickprefix: '$', ticksuffix: ' !', tickformat: '.2f'},
+                angularaxis: { tickprefix: '*', ticksuffix: '*' }
+            }
+        }
+    }, '.textpoint', [
+        ['%{theta} is %{r}', ['*a* is $1000.00 !', '*b* is $1200.00 !']]
+    ]);
 });

test/jasmine/tests/scatterternary_test.js

@@ -567,4 +567,27 @@ describe('Test scatterternary texttemplate:', function() {
     }], 'g.textpoint', [
         ['%{text} (%{a:.1f}, %{b:.1f}, %{c:.1f})', ['A (3.0, 2.0, 5.0)', 'B (2.0, 5.0, 2.0)', 'C (5.0, 2.0, 2.0)']]
     ]);
+
+    checkTextTemplate({
+        data: [{
+            type: 'scatterternary',
+            mode: 'text',
+            a: [3, 2, 5],
+            b: [2, 5, 2],
+            c: [5, 2, 2]
+        }],
+        layout: {
+            ternary: {
+                aaxis: { tickprefix: '*', ticksuffix: '*' },
+                baxis: { tickprefix: '$', ticksuffix: ' !', tickformat: '.2f'},
+                caxis: { tickprefix: '#', ticksuffix: '^'}
+            }
+        }
+    }, '.textpoint', [
+        ['%{a} is %{b} is %{c}', [
+            '*0.3* is $0.20 ! is #0.5^',
+            '*0.2222222* is $0.56 ! is #0.2222222^',
+            '*0.5555556* is $0.22 ! is #0.2222222^'
+        ]]
+    ]);
 });