add legend.groupclick option

Author: Paul Brussee

src/components/legend/attributes.js

@@ -109,6 +109,18 @@ module.exports = {
             '*false* disable legend item double-click interactions.'
         ].join(' ')
     },
+    groupclick: {
+        valType: 'enumerated',
+        values: ['toggleitem', 'togglegroup', false],
+        dflt: 'togglegroup',
+        editType: 'legend',
+        description: [
+            'Determines the behavior on legend group item click.',
+            '*toggleitem* toggles the visibility of the individual item clicked on the graph.',
+            '*togglegroup* toggles the visibility of all items in the same legendgroup as the item clicked on the graph.',
+            '*false* disable legend group click interactions.'
+        ].join(' ')
+    },
 
     x: {
         valType: 'number',

src/components/legend/defaults.js

@@ -110,6 +110,7 @@ module.exports = function legendDefaults(layoutIn, layoutOut, fullData) {
 
     coerce('itemclick');
     coerce('itemdoubleclick');
+    coerce('groupclick');
 
     coerce('x', defaultX);
     coerce('xanchor');

src/components/legend/handle_click.js

@@ -12,6 +12,7 @@ module.exports = function handleClick(g, gd, numClicks) {
 
     var itemClick = fullLayout.legend.itemclick;
     var itemDoubleClick = fullLayout.legend.itemdoubleclick;
+    var groupClick = fullLayout.legend.groupclick;
 
     if(numClicks === 1 && itemClick === 'toggle' && itemDoubleClick === 'toggleothers' &&
         SHOWISOLATETIP && gd.data && gd._context.showTips
@@ -27,6 +28,8 @@ module.exports = function handleClick(g, gd, numClicks) {
     else if(numClicks === 2) mode = itemDoubleClick;
     if(!mode) return;
 
+    var toggleGroup = groupClick === undefined || groupClick === "togglegroup";
+
     var hiddenSlices = fullLayout.hiddenlabels ?
         fullLayout.hiddenlabels.slice() :
         [];
@@ -148,10 +151,16 @@ module.exports = function handleClick(g, gd, numClicks) {
             }
 
             if(hasLegendgroup) {
-                for(i = 0; i < fullData.length; i++) {
-                    if(fullData[i].visible !== false && fullData[i].legendgroup === legendgroup) {
-                        setVisibility(fullData[i], nextVisibility);
+                if(groupClick === false) return;
+
+                if(toggleGroup) {
+                    for(i = 0; i < fullData.length; i++) {
+                        if(fullData[i].visible !== false && fullData[i].legendgroup === legendgroup) {
+                            setVisibility(fullData[i], nextVisibility);
+                        }
                     }
+                } else {
+                    setVisibility(fullTrace, nextVisibility);
                 }
             } else {
                 setVisibility(fullTrace, nextVisibility);
@@ -192,7 +201,8 @@ module.exports = function handleClick(g, gd, numClicks) {
                         // N.B. consider traces that have a set legendgroup as toggleable
                         notInLegend = (fullData[i].showlegend !== true && !fullData[i].legendgroup);
                         isInGroup = isClicked || (hasLegendgroup && fullData[i].legendgroup === legendgroup);
-                        setVisibility(fullData[i], (isInGroup || notInLegend) ? true : otherState);
+                        if(isInGroup && groupClick === false) continue;
+                        setVisibility(fullData[i], ((isInGroup && toggleGroup) || notInLegend) ? true : otherState);
                         break;
                 }
             }
@@ -219,7 +229,7 @@ module.exports = function handleClick(g, gd, numClicks) {
         for(i = 0; i < keys.length; i++) {
             key = keys[i];
             for(j = 0; j < attrIndices.length; j++) {
-                // Use hasOwnPropety to protect against falsey values:
+                // Use hasOwnProperty to protect against falsy values:
                 if(!attrUpdate[key].hasOwnProperty(j)) {
                     attrUpdate[key][j] = undefined;
                 }

test/plot-schema.json

@@ -2705,6 +2705,17 @@
       false
      ]
     },
+    "groupclick": {
+        "description": "Determines the behavior on legend group item click. *toggleitem* toggles the visibility of the individual item clicked on the graph. *togglegroup* toggles the visibility of all items in the same legendgroup as the item clicked on the graph. *false* disable legend group click interactions.",
+        "dflt": "togglegroup",
+        "editType": "legend",
+        "valType": "enumerated",
+        "values": [
+            "toggleitem",
+            "togglegroup",
+            false
+        ]
+    },
     "itemsizing": {
      "description": "Determines if the legend items symbols scale with their corresponding *trace* attributes or remain *constant* independent of the symbol size on the graph.",
      "dflt": "trace",