I am currently stumbling a bit with the following problem:
I have a map (SVG graphic) which I present in a fixed size document. The users are allowed to zoom this map via either pinch zoom or via a zoom slider and (when zoomed) are also able to pan the map in order to explore various details. This part is working fine (is related to this topic.).
My problem is to ensure that when zooming via the zoom slide control or via the pinch zoom gesture, the scaling of the map should happen from the current center of the viewport, and not from the transform anchor point of the map element. This is obviously only relevant when the map is zoomed and panned.
Somehow I can’t quite wrap my head around the coordinate transforms that I assume are needed for this to work. Does anybody happen to have something like this implemented, and would consider sharing the project/code or any tips?
I tried porting something like this solution, which appears to work in general, but it’s really specific to a image, instead of working with a scalable div/element. I at least wasn’t able to rewrite the math part to work within Tumult.