Enable zooming with modifier key + two-finger trackpad scroll

[quincylvania]

With the recent addition of two-finger panning, it is no longer possible to zoom via scrolling on a trackpad. While pinch-to-zoom works as an alternative, apps such as Apple Maps also allow scroll-to-zoom while holding down Shift or a similar modifier key. iD should adopt this interaction.

[bhousel]

With the recent addition of two-finger panning, it is no longer possible to zoom via scrolling on a trackpad. While pinch-to-zoom works as an alternative, apps such as Apple Maps also allow scroll-to-zoom while holding down Shift or a similar modifier key. iD should adopt this interaction.

The old style 2-finger scroll zoom will still work if you have the control key pressed..

That's actually the hack that all the browsers implemented so that the pinch zoom works - they turn the pinch zoom into a mousewheel event with ctrl key pressed.
https://medium.com/@auchenberg/detecting-multi-touch-trackpad-gestures-in-javascript-a2505babb10e

[quincylvania]

Oh neat! I didn't see that since I have control+scroll mapped to zoom the entire display. I can change that.

What do you think of redundantly adding Shift or Alt/Option for this so users have a choice? I could work on it.

[bhousel]

What do you think of redundantly adding Shift or Alt/Option for this so users have a choice? I could work on it.

Sounds good to me 👍

I think the code to adjust might just be the two else if blocks here:

iD/modules/renderer/map.js

Lines 455 to 479 in 152f658

	// 2 finger map panning (all browsers) - #5492
	// Panning via the `wheel` event will always have:
	// - `ctrlKey = false`
	// - `deltaX`,`deltaY` are round integer pixels
	} else if (!source.ctrlKey && isInteger(dX) && isInteger(dY)) {
	p1 = projection.translate();
	x2 = p1[0] - dX;
	y2 = p1[1] - dY;
	k2 = projection.scale();
	// 2 finger map pinch zooming (all browsers except Safari) - #5492
	// Pinch zooming via the `wheel` event will always have:
	// - `ctrlKey = true`
	// - `deltaY` is not round integer pixels (ignore `deltaX`)
	} else if (source.ctrlKey && !isInteger(dY)) {
	dY *= 6; // slightly scale up whatever the browser gave us
	// recalculate x2,y2,k2
	t0 = _transformed ? _transformLast : _transformStart;
	p0 = mouse(source);
	p1 = t0.invert(p0);
	k2 = t0.k * Math.pow(2, -dY / 500);
	x2 = p0[0] - p1[0] * k2;
	y2 = p0[1] - p1[1] * k2;
	}