d3 / d3-zoom

Pan and zoom SVG, HTML or Canvas using mouse or touch input.
https://d3js.org/d3-zoom
ISC License
507 stars 143 forks source link

dbltap doesn't work on iPad #206

Closed Fil closed 4 years ago

Fil commented 4 years ago

Testing d3-zoom (e.g. https://observablehq.com/@d3/zoom-canvas-rescaled or any other) on an iPad, a dbltap doesn't trigger x2 zooming—but a triple tap does. With the pencil it's never triggered, no matter how many "taps".

(On the iPhone dbltap works. )

I'm investigating but it would be nice if someone could confirm or infirm this observation.

Fil commented 4 years ago
mbostock commented 4 years ago

I don’t remember what the point of touch-action: none was…

Fil commented 4 years ago

It looks like the iPad really wants to deduplicate touchstart: on https://observablehq.com/d/a6c2cfc4e1fad9ea as soon as a touchstart listener is registered, a double-tap creates only one event of each kind (touchstart, mousedown, mousemove, mouseup, click and so on).

A solution might be to switch to Pointer Events (https://observablehq.com/@fil/pointer-events), where this doesn't happen. But it looks to me like an iOS (iPad 13.4.1) bug (?).

Fil commented 4 years ago

Re: pencil dbl-tap, the issue is that a touchmove event is received, in which we reset g.taps to 0.

This issue can be fixed by removing:

      if (touchstarting) touchstarting = clearTimeout(touchstarting);
      g.taps = 0;
Fil commented 4 years ago

Another comment on touch-action… https://github.com/d3/d3-zoom/pull/188#pullrequestreview-280081671

Fil commented 4 years ago

After some digging it appears that touch-action: none was added at about the same time as this conversation happened. In that case it might be related with enabling something (?) on Surface tablets.