move grouptitlefont inside legend object

Author: archmoj

draftlogs/6040_add.md

@@ -1 +1 @@
- - Implement legendgrouptitlefont and hoverlabel.grouptitlefont [[#6040](https://github.com/plotly/plotly.js/pull/6040)]
+ - Implement legend.grouptitlefont and hoverlabel.grouptitlefont [[#6040](https://github.com/plotly/plotly.js/pull/6040)]

src/components/fx/hover.js

@@ -1103,7 +1103,9 @@ function createHoverText(hoverData, opts) {
                 orientation: 'v'
             }
         };
-        var mockLayoutOut = {};
+        var mockLayoutOut = {
+            font: font
+        };
         legendSupplyDefaults(mockLayoutIn, mockLayoutOut, gd._fullData);
         var mockLegend = mockLayoutOut.legend;
 

src/components/fx/hoverlabel_defaults.js

@@ -7,9 +7,13 @@ var isUnifiedHover = require('./helpers').isUnifiedHover;
 module.exports = function handleHoverLabelDefaults(contIn, contOut, coerce, opts) {
     opts = opts || {};
 
+    var hasLegend =
+        contOut.legend &&
+        contOut.legend.font;
+
     function inheritFontAttr(attr) {
         if(!opts.font[attr]) {
-            opts.font[attr] = contOut.legend ? contOut.legend.font[attr] : contOut.font[attr];
+            opts.font[attr] = hasLegend ? contOut.legend.font[attr] : contOut.font[attr];
         }
     }
 
@@ -20,7 +24,7 @@ module.exports = function handleHoverLabelDefaults(contIn, contOut, coerce, opts
         inheritFontAttr('family');
         inheritFontAttr('color');
 
-        if(contOut.legend) {
+        if(hasLegend) {
             if(!opts.bgcolor) opts.bgcolor = Color.combine(contOut.legend.bgcolor, contOut.paper_bgcolor);
             if(!opts.bordercolor) opts.bordercolor = contOut.legend.bordercolor;
         } else {

src/components/legend/attributes.js

@@ -30,6 +30,13 @@ module.exports = {
         editType: 'legend',
         description: 'Sets the font used to text the legend items.'
     }),
+    grouptitlefont: fontAttrs({
+        editType: 'legend',
+        description: [
+            'Sets the font for group titles in legend.',
+            'Defaults to `legend.font` with its size increased about 10%.'
+        ].join(' ')
+    }),
     orientation: {
         valType: 'enumerated',
         values: ['v', 'h'],

src/components/legend/defaults.js

@@ -4,20 +4,39 @@ var Registry = require('../../registry');
 var Lib = require('../../lib');
 var Template = require('../../plot_api/plot_template');
 
+var plotsAttrs = require('../../plots/attributes');
 var attributes = require('./attributes');
 var basePlotLayoutAttributes = require('../../plots/layout_attributes');
 var helpers = require('./helpers');
 
 
 module.exports = function legendDefaults(layoutIn, layoutOut, fullData) {
     var containerIn = layoutIn.legend || {};
+    var containerOut = Template.newContainer(layoutOut, 'legend');
+
+    function coerce(attr, dflt) {
+        return Lib.coerce(containerIn, containerOut, attributes, attr, dflt);
+    }
+
+    var trace;
+
+    function traceCoerce(attr, dflt) {
+        var traceIn = trace._input;
+        var traceOut = trace;
+        return Lib.coerce(traceIn, traceOut, plotsAttrs, attr, dflt);
+    }
+
+    var globalFont = layoutOut.font || {};
+    var grouptitlefont = Lib.coerceFont(coerce, 'grouptitlefont', Lib.extendFlat({}, globalFont, {
+        size: Math.round(globalFont.size * 1.1)
+    }));
 
     var legendTraceCount = 0;
     var legendReallyHasATrace = false;
     var defaultOrder = 'normal';
 
     for(var i = 0; i < fullData.length; i++) {
-        var trace = fullData[i];
+        trace = fullData[i];
 
         if(!trace.visible) continue;
 
@@ -44,6 +63,8 @@ module.exports = function legendDefaults(layoutIn, layoutOut, fullData) {
                     legendTraceCount++;
                 }
             }
+
+            Lib.coerceFont(traceCoerce, 'legendgrouptitle.font', grouptitlefont);
         }
 
         if((Registry.traceIs(trace, 'bar') && layoutOut.barmode === 'stack') ||
@@ -64,12 +85,6 @@ module.exports = function legendDefaults(layoutIn, layoutOut, fullData) {
 
     if(showLegend === false && !containerIn.uirevision) return;
 
-    var containerOut = Template.newContainer(layoutOut, 'legend');
-
-    function coerce(attr, dflt) {
-        return Lib.coerce(containerIn, containerOut, attributes, attr, dflt);
-    }
-
     coerce('uirevision', layoutOut.uirevision);
 
     if(showLegend === false) return;

src/plot_api/plot_api.js

@@ -1719,7 +1719,7 @@ function cleanDeprecatedAttributeKeys(aobj) {
         if((key === 'title' || oldAxisTitleRegex.test(key) || colorbarRegex.test(key)) &&
           (typeof value === 'string' || typeof value === 'number')) {
             replace(key, key.replace('title', 'title.text'));
-        } else if(key.indexOf('titlefont') > -1) {
+        } else if(key.indexOf('titlefont') > -1 && key.indexOf('grouptitlefont') === -1) {
             replace(key, key.replace('titlefont', 'title.font'));
         } else if(key.indexOf('titleposition') > -1) {
             replace(key, key.replace('titleposition', 'title.position'));

src/plots/layout_attributes.js

@@ -309,13 +309,6 @@ module.exports = {
             'c) One trace is explicitly given with `showlegend: true`.'
         ].join(' ')
     },
-    legendgrouptitlefont: 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',

src/plots/plots.js

@@ -1321,11 +1321,7 @@ plots.supplyTraceDefaults = function(traceIn, traceOut, colorIndex, layout, trac
             );
 
             coerce('legendgroup');
-            var titleText = coerce('legendgrouptitle.text');
-            if(titleText) {
-                Lib.coerceFont(coerce, 'legendgrouptitle.font', layout.legendgrouptitlefont);
-            }
-
+            coerce('legendgrouptitle.text');
             coerce('legendrank');
 
             traceOut._dfltShowLegend = true;
@@ -1476,10 +1472,6 @@ plots.supplyLayoutGlobalDefaults = function(layoutIn, layoutOut, formatObj) {
     var font = Lib.coerceFont(coerce, 'font');
     var fontSize = font.size;
 
-    Lib.coerceFont(coerce, 'legendgrouptitlefont', Lib.extendFlat({}, font, {
-        size: Math.round(fontSize * 1.1)
-    }));
-
     Lib.coerceFont(coerce, 'title.font', Lib.extendFlat({}, font, {
         size: Math.round(fontSize * 1.4)
     }));

test/image/mocks/legendrank.json

@@ -44,10 +44,12 @@
         "size": 16
       }
     },
-    "legendgrouptitlefont": {
-      "family": "Times New Roman",
-      "color": "orange",
-      "size": 14
+    "legend": {
+      "grouptitlefont": {
+        "family": "Times New Roman",
+        "color": "orange",
+        "size": 14
+      }
     },
     "margin": {
       "t": 50,

test/plot-schema.json

@@ -2714,6 +2714,27 @@
       "togglegroup"
      ]
     },
+    "grouptitlefont": {
+     "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"
+     }
+    },
     "itemclick": {
      "description": "Determines the behavior on legend item click. *toggle* toggles the visibility of the item clicked on the graph. *toggleothers* makes the clicked item the sole visible item on the graph. *false* disables legend item click interactions.",
      "dflt": "toggle",
@@ -2878,27 +2899,6 @@
      ]
     }
    },
-   "legendgrouptitlefont": {
-    "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": [
      {}