diff --git a/src/traces/scatter/select.js b/src/traces/scatter/select.js index 2743ca83fca..fbe0cd63a6f 100644 --- a/src/traces/scatter/select.js +++ b/src/traces/scatter/select.js @@ -27,7 +27,8 @@ module.exports = function selectPoints(searchInfo, polygon) { y; // TODO: include lines? that would require per-segment line properties - if(!subtypes.hasMarkers(trace) && ! subtypes.hasText(trace)) return; + var hasOnlyLines = (!subtypes.hasMarkers(trace) && !subtypes.hasText(trace)); + if(trace.visible !== true || hasOnlyLines) return; var opacity = Array.isArray(marker.opacity) ? 1 : marker.opacity; diff --git a/test/jasmine/tests/select_test.js b/test/jasmine/tests/select_test.js index 5cf94265cea..f709d3b962c 100644 --- a/test/jasmine/tests/select_test.js +++ b/test/jasmine/tests/select_test.js @@ -286,4 +286,51 @@ describe('select box and lasso', function() { }); }); }); + + it('should skip over non-visible traces', function(done) { + var mockCopy = Lib.extendDeep({}, mock); + mockCopy.layout.dragmode = 'select'; + + var selectPath = [[100, 200], [150, 200]]; + var lassoPath = [[331, 178], [333, 246], [350, 250], [343, 176]]; + + var gd = createGraphDiv(); + var selectedPtLength; + + Plotly.plot(gd, mockCopy.data, mockCopy.layout).then(function() { + gd.on('plotly_selected', function(data) { + selectedPtLength = data.points.length; + }); + + drag(selectPath); + expect(selectedPtLength).toEqual(2, '(case 0)'); + + return Plotly.restyle(gd, 'visible', 'legendonly'); + }).then(function() { + drag(selectPath); + expect(selectedPtLength).toEqual(0, '(legendonly case)'); + + return Plotly.restyle(gd, 'visible', true); + }).then(function() { + drag(selectPath); + expect(selectedPtLength).toEqual(2, '(back to case 0)'); + + return Plotly.relayout(gd, 'dragmode', 'lasso'); + }).then(function() { + drag(lassoPath); + expect(selectedPtLength).toEqual(1, '(case 0 lasso)'); + + return Plotly.restyle(gd, 'visible', 'legendonly'); + }).then(function() { + drag(lassoPath); + expect(selectedPtLength).toEqual(0, '(lasso legendonly case)'); + + return Plotly.restyle(gd, 'visible', true); + }).then(function() { + drag(lassoPath); + expect(selectedPtLength).toEqual(1, '(back to lasso case 0)'); + + done(); + }); + }); });