use contrast color with heatmap when there is no textfont.color

Author: archmoj

src/traces/heatmap/defaults.js

@@ -29,7 +29,8 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
     coerce('hovertemplate');
     coerce('texttemplate');
 
-    var fontDflt = Lib.extendFlat({}, layout.font, {color: 'white'});
+    var fontDflt = Lib.extendFlat({}, layout.font);
+    fontDflt.color = undefined; // color contrast by default
     Lib.coerceFont(coerce, 'textfont', fontDflt);
 
     handleStyleDefaults(traceIn, traceOut, coerce, layout);

src/traces/heatmap/plot.js

@@ -9,6 +9,7 @@ var Axes = require('../../plots/cartesian/axes');
 var Lib = require('../../lib');
 var svgTextUtils = require('../../lib/svg_text_utils');
 var formatLabels = require('../scatter/format_labels');
+var Color = require('../../components/color');
 var extractOpts = require('../../components/colorscale').extractOpts;
 var makeColorScaleFuncFromTrace = require('../../components/colorscale').makeColorScaleFuncFromTrace;
 var xmlnsNamespaces = require('../../constants/xmlns_namespaces');
@@ -420,7 +421,8 @@ module.exports = function(gd, plotinfo, cdheatmaps, heatmapLayer) {
                     textData.push({
                         t: _t,
                         x: _x,
-                        y: _y
+                        y: _y,
+                        z: zVal
                     });
                 }
             }
@@ -443,10 +445,19 @@ module.exports = function(gd, plotinfo, cdheatmaps, heatmapLayer) {
                 .each(function(d) {
                     var thisLabel = d3.select(this);
 
+                    var fontColor = font.color;
+                    if(!fontColor) {
+                        fontColor = Color.contrast(
+                            'rgba(' +
+                                sclFunc(d.z).join() +
+                            ')'
+                        );
+                    }
+
                     thisLabel
                         .attr('data-notex', 1)
                         .call(svgTextUtils.positionText, xFn(d), yFn(d))
-                        .call(Drawing.font, font.family, font.size, font.color)
+                        .call(Drawing.font, font.family, font.size, fontColor)
                         .text(d.t)
                         .call(svgTextUtils.convertToTspans, gd);
                 });

test/image/baselines/13.png

@@ -15,7 +15,6 @@
     "type": "heatmap",
     "texttemplate": "x: %{x}<br>y: %{y}<br>z: %{z}",
     "textfont": {
-      "family": "Raleway",
       "size": 14
     },
 

test/image/baselines/4.png

@@ -1,6 +1,7 @@
 {
     "data": [
         {
+            "texttemplate": "%{z:.1f}",
             "z": [
                 [
                     0.1189977,
@@ -31,6 +32,7 @@
             "yaxis": "y"
         },
         {
+            "texttemplate": "%{z:.1f}",
             "z": [
                 [
                     0.1189977,
@@ -61,6 +63,7 @@
             "yaxis": "y2"
         },
         {
+            "texttemplate": "%{z:.1f}",
             "z": [
                 [
                     0.1189977,