implement grouptitlesfont for hover and legend

Author: archmoj

src/components/fx/hover.js

@@ -1144,7 +1144,8 @@ function createHoverText(hoverData, opts) {
 
         // Draw unified hover label
         mockLegend._inHover = true;
-        mockLegend._groupTitleFont = font;
+        mockLegend._groupTitleFont = hoverlabel.grouptitlesfont;
+
         legendDraw(gd, mockLegend);
 
         // Position the hover

src/components/fx/layout_attributes.js

@@ -2,12 +2,14 @@
 
 var constants = require('./constants');
 
-var fontAttrs = require('../../plots/font_attributes')({
+var fontAttrs = require('../../plots/font_attributes');
+
+var font = fontAttrs({
     editType: 'none',
     description: 'Sets the default hover label font used by all traces on the graph.'
 });
-fontAttrs.family.dflt = constants.HOVERFONT;
-fontAttrs.size.dflt = constants.HOVERFONTSIZE;
+font.family.dflt = constants.HOVERFONT;
+font.size.dflt = constants.HOVERFONTSIZE;
 
 module.exports = {
     clickmode: {
@@ -118,7 +120,7 @@ module.exports = {
                 'Sets the border color of all hover labels on graph.'
             ].join(' ')
         },
-        font: fontAttrs,
+        font: font,
         align: {
             valType: 'enumerated',
             values: ['left', 'right', 'auto'],
@@ -143,6 +145,14 @@ module.exports = {
                 '`namelength - 3` characters and add an ellipsis.'
             ].join(' ')
         },
+        grouptitlesfont: fontAttrs({
+            editType: 'none',
+            description: [
+                'Sets the font for group titles in hover (unified modes).',
+                'Defaults to `hoverlabel.font`.'
+            ].join(' ')
+        }),
+
         editType: 'none'
     },
     selectdirection: {

src/components/fx/layout_defaults.js

@@ -34,4 +34,6 @@ module.exports = function supplyLayoutDefaults(layoutIn, layoutOut) {
     }
 
     handleHoverLabelDefaults(layoutIn, layoutOut, coerce);
+
+    Lib.coerceFont(coerce, 'hoverlabel.grouptitlesfont', layoutOut.hoverlabel.font);
 };

src/plots/layout_attributes.js

@@ -309,6 +309,14 @@ module.exports = {
             'c) One trace is explicitly given with `showlegend: true`.'
         ].join(' ')
     },
+    legendgrouptitlesfont: fontAttrs({
+        editType: 'legend',
+        description: [
+            'Sets the font for group titles in legend.',
+            'Defaults to `legend.font` with its size increased about 10%.'
+        ].join(' ')
+    }),
+
     colorway: {
         valType: 'colorlist',
         dflt: colorAttrs.defaults,

src/plots/plots.js

@@ -1323,9 +1323,7 @@ plots.supplyTraceDefaults = function(traceIn, traceOut, colorIndex, layout, trac
             coerce('legendgroup');
             var titleText = coerce('legendgrouptitle.text');
             if(titleText) {
-                Lib.coerceFont(coerce, 'legendgrouptitle.font', Lib.extendFlat({}, layout.font, {
-                    size: Math.round(layout.font.size * 1.1) // default to larger font size
-                }));
+                Lib.coerceFont(coerce, 'legendgrouptitle.font', layout.legendgrouptitlesfont);
             }
 
             coerce('legendrank');
@@ -1475,16 +1473,18 @@ plots.supplyLayoutGlobalDefaults = function(layoutIn, layoutOut, formatObj) {
 
     coerce('autotypenumbers');
 
-    var globalFont = Lib.coerceFont(coerce, 'font');
+    var font = Lib.coerceFont(coerce, 'font');
+    var fontSize = font.size;
 
-    coerce('title.text', layoutOut._dfltTitle.plot);
+    Lib.coerceFont(coerce, 'legendgrouptitlesfont', Lib.extendFlat({}, font, {
+        size: Math.round(fontSize * 1.1)
+    }));
 
-    Lib.coerceFont(coerce, 'title.font', {
-        family: globalFont.family,
-        size: Math.round(globalFont.size * 1.4),
-        color: globalFont.color
-    });
+    Lib.coerceFont(coerce, 'title.font', Lib.extendFlat({}, font, {
+        size: Math.round(fontSize * 1.4)
+    }));
 
+    coerce('title.text', layoutOut._dfltTitle.plot);
     coerce('title.xref');
     coerce('title.yref');
     coerce('title.x');

test/image/baselines/legendrank.png

@@ -37,6 +37,18 @@
       "text": "legendrank"
     },
     "hovermode": "x unified",
+    "hoverlabel": {
+      "grouptitlesfont": {
+        "family": "Raleway",
+        "color": "red",
+        "size": 16
+      }
+    },
+    "legendgrouptitlesfont": {
+      "family": "Times New Roman",
+      "color": "orange",
+      "size": 14
+    },
     "margin": {
       "t": 50,
       "b": 25

test/image/mocks/legendrank.json

@@ -2494,6 +2494,27 @@
       "valType": "number"
      }
     },
+    "grouptitlesfont": {
+     "color": {
+      "editType": "none",
+      "valType": "color"
+     },
+     "description": "Sets the font for group titles in hover (unified modes). Defaults to `hoverlabel.font`.",
+     "editType": "none",
+     "family": {
+      "description": "HTML font family - the typeface that will be applied by the web browser. The web browser will only be able to apply a font if it is available on the system which it operates. Provide multiple font families, separated by commas, to indicate the preference in which to apply fonts if they aren't available on the system. The Chart Studio Cloud (at https://chart-studio.plotly.com or on-premise) generates images on a server, where only a select number of fonts are installed and supported. These include *Arial*, *Balto*, *Courier New*, *Droid Sans*,, *Droid Serif*, *Droid Sans Mono*, *Gravitas One*, *Old Standard TT*, *Open Sans*, *Overpass*, *PT Sans Narrow*, *Raleway*, *Times New Roman*.",
+      "editType": "none",
+      "noBlank": true,
+      "strict": true,
+      "valType": "string"
+     },
+     "role": "object",
+     "size": {
+      "editType": "none",
+      "min": 1,
+      "valType": "number"
+     }
+    },
     "namelength": {
      "description": "Sets the default length (in number of characters) of the trace name in the hover labels for all traces. -1 shows the whole name regardless of length. 0-3 shows the first 0-3 characters, and an integer >3 will show the whole name if it is less than that many characters, but if it is longer, will truncate to `namelength - 3` characters and add an ellipsis.",
      "dflt": 15,
@@ -2857,6 +2878,27 @@
      ]
     }
    },
+   "legendgrouptitlesfont": {
+    "color": {
+     "editType": "legend",
+     "valType": "color"
+    },
+    "description": "Sets the font for group titles in legend. Defaults to `legend.font` with its size increased about 10%.",
+    "editType": "legend",
+    "family": {
+     "description": "HTML font family - the typeface that will be applied by the web browser. The web browser will only be able to apply a font if it is available on the system which it operates. Provide multiple font families, separated by commas, to indicate the preference in which to apply fonts if they aren't available on the system. The Chart Studio Cloud (at https://chart-studio.plotly.com or on-premise) generates images on a server, where only a select number of fonts are installed and supported. These include *Arial*, *Balto*, *Courier New*, *Droid Sans*,, *Droid Serif*, *Droid Sans Mono*, *Gravitas One*, *Old Standard TT*, *Open Sans*, *Overpass*, *PT Sans Narrow*, *Raleway*, *Times New Roman*.",
+     "editType": "legend",
+     "noBlank": true,
+     "strict": true,
+     "valType": "string"
+    },
+    "role": "object",
+    "size": {
+     "editType": "legend",
+     "min": 1,
+     "valType": "number"
+    }
+   },
    "mapbox": {
     "_arrayAttrRegexps": [
      {}