From 95f8e36a2accb0341b565a913941d7e373e90bf3 Mon Sep 17 00:00:00 2001 From: Quincy Morgan Date: Tue, 19 May 2020 17:24:47 -0400 Subject: [PATCH] Add a small tolerance to node dragging so selecting them no longer requires zero movement (close #1981) --- modules/behavior/drag.js | 36 ++++++++++++++++++++++-------------- modules/behavior/select.js | 2 +- 2 files changed, 23 insertions(+), 15 deletions(-) diff --git a/modules/behavior/drag.js b/modules/behavior/drag.js index 3d222c3d47..86eb4d27f2 100644 --- a/modules/behavior/drag.js +++ b/modules/behavior/drag.js @@ -7,6 +7,7 @@ import { selection as d3_selection } from 'd3-selection'; +import { geoVecLength } from '../geo'; import { osmNote } from '../osm'; import { utilRebind } from '../util/rebind'; import { utilFastMouse, utilPrefixCSSProperty, utilPrefixDOMProperty } from '../util'; @@ -29,6 +30,11 @@ import { utilFastMouse, utilPrefixCSSProperty, utilPrefixDOMProperty } from '../ export function behaviorDrag() { var dispatch = d3_dispatch('start', 'move', 'end'); + + // see also behaviorSelect + var _tolerancePx = 1; // keep this low to facilitate pixel-perfect micromapping + var _penTolerancePx = 4; // styluses can be touchy so require greater movement - #1981 + var _origin = null; var _selector = ''; var _event; @@ -93,26 +99,28 @@ export function behaviorDrag() { if (_pointerId !== (d3_event.pointerId || 'mouse')) return; var p = pointerLocGetter(d3_event); - var dx = p[0] - startOrigin[0]; - var dy = p[1] - startOrigin[1]; - if (dx === 0 && dy === 0) - return; + if (!started) { + var dist = geoVecLength(startOrigin, p); + var tolerance = d3_event.pointerType === 'pen' ? _penTolerancePx : _tolerancePx; + // don't start until the drag has actually moved somewhat + if (dist < tolerance) return; + + started = true; + _event({ type: 'start' }); + } startOrigin = p; d3_event.stopPropagation(); d3_event.preventDefault(); - if (!started) { - started = true; - _event({ type: 'start' }); - } else { - _event({ - type: 'move', - point: [p[0] + offset[0], p[1] + offset[1]], - delta: [dx, dy] - }); - } + var dx = p[0] - startOrigin[0]; + var dy = p[1] - startOrigin[1]; + _event({ + type: 'move', + point: [p[0] + offset[0], p[1] + offset[1]], + delta: [dx, dy] + }); } diff --git a/modules/behavior/select.js b/modules/behavior/select.js index 1dce638530..58c84054a4 100644 --- a/modules/behavior/select.js +++ b/modules/behavior/select.js @@ -11,7 +11,7 @@ import { utilFastMouse } from '../util/util'; export function behaviorSelect(context) { - var _tolerancePx = 4; + var _tolerancePx = 4; // see also behaviorDrag var _lastPointerEvent = null; var _showMenu = false; var _p1 = null;