Merge pull request #4406 from plotly/legend-toggleothers-doot-hide-traces-not-in-legend

Fix *toggleothers* behavior for graphs with traces not in legend

Author: etpinard

src/components/legend/handle_click.js

@@ -165,11 +165,12 @@ module.exports = function handleClick(g, gd, numClicks) {
         } else if(mode === 'toggleothers') {
             // Compute the clicked index. expandedIndex does what we want for expanded traces
             // but also culls hidden traces. That means we have some work to do.
-            var isClicked, isInGroup, otherState;
+            var isClicked, isInGroup, notInLegend, otherState;
             var isIsolated = true;
             for(i = 0; i < fullData.length; i++) {
                 isClicked = fullData[i] === fullTrace;
-                if(isClicked) continue;
+                notInLegend = fullData[i].showlegend !== true;
+                if(isClicked || notInLegend) continue;
 
                 isInGroup = (hasLegendgroup && fullData[i].legendgroup === legendgroup);
 
@@ -194,8 +195,10 @@ module.exports = function handleClick(g, gd, numClicks) {
                     case true:
                         otherState = isIsolated ? true : 'legendonly';
                         isClicked = fullData[i] === fullTrace;
+                        // 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 ? true : otherState);
+                        setVisibility(fullData[i], (isInGroup || notInLegend) ? true : otherState);
                         break;
                 }
             }

test/jasmine/tests/legend_test.js

@@ -1519,6 +1519,53 @@ describe('legend interaction', function() {
             });
         });
 
+        describe('legend visibility with *showlegend:false* traces', function() {
+            beforeEach(function(done) {
+                Plotly.plot(gd, [
+                    {y: [1, 2, 3]},
+                    {y: [2, 3, 1]},
+                    {type: 'heatmap', z: [[1, 2], [3, 4]], showscale: false}
+                ])
+                .then(done);
+            });
+
+            it('isolate trace in legend, ignore trace that is not in legend', function(done) {
+                Promise.resolve()
+                    .then(click(0, 2))
+                    .then(assertVisible([true, 'legendonly', true]))
+                    .then(click(0, 2))
+                    .then(assertVisible([true, true, true]))
+                    .catch(failTest).then(done);
+            });
+
+            it('isolate trace in legend, ignore trace that is not in legend (2)', function(done) {
+                Promise.resolve()
+                    .then(click(1, 2))
+                    .then(assertVisible(['legendonly', true, true]))
+                    .then(click(1, 2))
+                    .then(assertVisible([true, true, true]))
+                    .catch(failTest).then(done);
+            });
+
+            it('isolate trace in legend AND trace in associated legendgroup', function(done) {
+                Plotly.restyle(gd, 'legendgroup', ['group', '', 'group'])
+                    .then(click(0, 2))
+                    .then(assertVisible([true, 'legendonly', true]))
+                    .then(click(0, 2))
+                    .then(assertVisible([true, true, true]))
+                    .catch(failTest).then(done);
+            });
+
+            it('isolate trace in legend, hide trace not in legend that has set legendgroup', function(done) {
+                Plotly.restyle(gd, 'legendgroup', ['group', '', 'group'])
+                    .then(click(1, 2))
+                    .then(assertVisible(['legendonly', true, 'legendonly']))
+                    .then(click(1, 2))
+                    .then(assertVisible([true, true, true]))
+                    .catch(failTest).then(done);
+            });
+        });
+
         describe('custom legend click/doubleclick handlers', function() {
             var fig, to;