Skip to content

Commit 1c12dba

Browse files
committed
🔪 2*MINDRAG requirement for zoomboxes to lead to relayout
- this requirement can lead to visible 1d or 2d zoomboxes that do not lead to an axis range relayout, leading to confusing behaviour - lock this down in a test making sure small zoomboxes lead are followed by relayout calls.
1 parent eb2d4e9 commit 1c12dba

File tree

2 files changed

+60
-7
lines changed

2 files changed

+60
-7
lines changed

src/plots/cartesian/dragbox.js

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -429,14 +429,7 @@ function makeDragBox(gd, plotinfo, x, y, w, h, ns, ew) {
429429
}
430430

431431
function zoomDone() {
432-
// more strict than dragged, which allows you to come back to where you started
433-
// and still count as dragged
434-
if(Math.min(box.h, box.w) < MINDRAG * 2) {
435-
return removeZoombox(gd);
436-
}
437-
438432
computeZoomUpdates();
439-
440433
removeZoombox(gd);
441434
dragTail();
442435
showDoubleClickNotifier(gd);

test/jasmine/tests/cartesian_interact_test.js

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1914,6 +1914,66 @@ describe('axis zoom/pan and main plot zoom', function() {
19141914
.then(done);
19151915
});
19161916
});
1917+
1918+
it('zoomboxes during small drag motions', function(done) {
1919+
var MINDRAG = constants.MINDRAG;
1920+
var eventData = {};
1921+
1922+
function _run(msg, dpos, exp) {
1923+
return function() {
1924+
var node = getDragger('xy', 'nsew');
1925+
var fns = drag.makeFns({node: node, pos0: [200, 200], dpos: dpos});
1926+
1927+
return fns.start().then(function() {
1928+
var zl = d3.select(gd).select('g.zoomlayer');
1929+
var d = zl.select('.zoombox-corners').attr('d');
1930+
if(exp === 'nozoom') {
1931+
expect(d).toBe('M0,0Z', 'blank path | ' + msg);
1932+
} else {
1933+
var actual = (d.match(/Z/g) || []).length;
1934+
if(exp === 'x-zoom' || exp === 'y-zoom') {
1935+
expect(actual).toBe(2, 'two corners | ' + msg);
1936+
} else if(exp === 'xy-zoom') {
1937+
expect(actual).toBe(4, 'four corners | ' + msg);
1938+
} else {
1939+
fail('wrong expectation str.');
1940+
}
1941+
}
1942+
})
1943+
.then(fns.end)
1944+
.then(function() {
1945+
var keys = Object.keys(eventData);
1946+
if(exp === 'nozoom') {
1947+
expect(keys.length).toBe(0, 'no event data | ' + msg);
1948+
} else if(exp === 'x-zoom') {
1949+
expect(keys).withContext('relayout xaxis rng | ' + msg)
1950+
.toEqual(['xaxis.range[0]', 'xaxis.range[1]']);
1951+
} else if(exp === 'y-zoom') {
1952+
expect(keys).withContext('relayout yaxis rng | ' + msg)
1953+
.toEqual(['yaxis.range[0]', 'yaxis.range[1]']);
1954+
} else if(exp === 'xy-zoom') {
1955+
expect(keys.length).toBe(4, 'x and y relayout | ' + msg);
1956+
} else {
1957+
fail('wrong expectation str.');
1958+
}
1959+
eventData = {};
1960+
});
1961+
};
1962+
}
1963+
1964+
Plotly.plot(gd, [{y: [1, 2, 1]}], {width: 400, height: 400})
1965+
.then(function() {
1966+
gd.on('plotly_relayout', function(d) { eventData = d; });
1967+
})
1968+
.then(_run('dx < MINDRAG', [MINDRAG - 2, 0], 'nozoom'))
1969+
.then(_run('dx > MINDRAG', [MINDRAG + 2, 0], 'x-zoom'))
1970+
.then(_run('dy < MINDRAG', [0, MINDRAG - 2], 'nozoom'))
1971+
.then(_run('dy > MINDRAG', [0, MINDRAG + 2], 'y-zoom'))
1972+
.then(_run('(dx,dy) < MINDRAG', [MINDRAG - 2, MINDRAG - 2], 'nozoom'))
1973+
.then(_run('(dx,dy) > MINDRAG', [MINDRAG + 2, MINDRAG + 2], 'xy-zoom'))
1974+
.catch(failTest)
1975+
.then(done);
1976+
});
19171977
});
19181978

19191979
describe('Event data:', function() {

0 commit comments

Comments
 (0)