diff --git a/src/components/legend/attributes.js b/src/components/legend/attributes.js index 28a3d00fd25..5306de0e974 100644 --- a/src/components/legend/attributes.js +++ b/src/components/legend/attributes.js @@ -94,7 +94,7 @@ module.exports = { '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* disable legend item click interactions.' + '*false* disables legend item click interactions.' ].join(' ') }, itemdoubleclick: { @@ -106,7 +106,19 @@ module.exports = { 'Determines the behavior on legend item double-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* disable legend item double-click interactions.' + '*false* disables 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* disables legend group click interactions.' ].join(' ') }, diff --git a/src/components/legend/defaults.js b/src/components/legend/defaults.js index e74575f45de..7862a631956 100644 --- a/src/components/legend/defaults.js +++ b/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'); diff --git a/src/components/legend/handle_click.js b/src/components/legend/handle_click.js index f2b21412f04..39201933974 100644 --- a/src/components/legend/handle_click.js +++ b/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; }