d3 / d3-zoom

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

touchend or touchcancel event not being fired #120

Closed airasheed closed 5 years ago

airasheed commented 6 years ago

I'm using d3 with cordova packaging my code into a webview for iOS/Android.

I've found a bug in where D3 doesn't fire touchend or touchcancel, so if one finger is removed, it seems like it is in touch. So the next started touch makes it a multi-touch. I made a change to zoom.js and it fixed the error.

The change is in the touchStarted function in d3-zoom/src/zoom.js file and it fixes it for 2 touches.

if (!g.touch0) g.touch0 = p, started = true;

This:

 if (!g.touch0 || (event.touches.length == 1 && touches.length == 1)) g.touch0 = p, started = true;

I have a d3 & Ionic project that can be found on Github with project setup instructions here that shows the behavior after zooming.

I'm attempting to re-create the the issue here, but it's still a work in progress to reproduce.

mbostock commented 6 years ago

Related to #60?

airasheed commented 6 years ago

@mbostock Yes it seems to be related. I'm going to reproduce the behavior outside of the mobile environment. The code fix I placed above to zoom.js is working for me now, but i'm not sure if you'd accept a pull request without a working example inside of the browser that show that behavior.

mbostock commented 5 years ago

This appears to be a duplicate of #60.