search

anvaka / panzoom

Universal pan and zoom library (DOM, SVG, Custom)
https://anvaka.github.io/panzoom/demo/attach-via-script.html
MIT License
1.78k stars 285 forks source link

zoom point is not based on top of zoomable region. #42

Open daverodal opened 6 years ago

daverodal commented 6 years ago

https://jsfiddle.net/markarian/wLbocegs/5/

When I add a div full of text above the zoomable region. zoom happens not centered at mouse point but what seems like distance from top of page. so zoomable region will zoom as if mouse is at top. when it's really at the non zoomable region. See jsfiddle.

I think the zoom point needs to subtract the top of the current div, when the event comes through.

Thanks in advance for look at this.

anvaka commented 6 years ago

Sorry about this bug. A quick workaround would be to wrap your .zoomable into a div - here is an example: https://jsfiddle.net/wLbocegs/6/

The bug happens due to historical reasons of how we compute "local" offsetX/offsetY for various rendering engines (SVG, DOM).

The mouse event comes with clientX which is translated to offsetX using a bounding box of an owner. While this makes sense for SVG, it doesn't make much sense for body's children.

I'm not sure yet how to fix it correctly, but very likely we need to refactor this code and make it robust in face of various rendering engines.

grishnyakov commented 5 years ago

BUG! https://codepen.io/grishnyakov/pen/xmqdYm

grishnyakov commented 5 years ago

time to fix it! Бро, когда починишь?