Repeated Zooms, Centered On A Mouse Click
in
Programming Questions
•
2 years ago
I'm currently running an app where I have an SVG map of the US. I center the map with a translate(width/2, height/2) at the beginning of every draw loop.
I then track a "zoom" variable that increments and decrements with right and left mouse clicks, respectively. This variable is fed to the scale function, and results in the map being zoomed via clicking.
However, I would like the zoom to be centered around the click of the last mouse point. This is easy to do on a single click, as you just modify the translate arguments. However, as the clicks continue, and the zoom becomes higher, it becomes difficult to calculate the "layered" zooms that all involve a centered click at different levels of scale.
Does anyone have any insight on how to zoom on a clicked point, but keep re-centering on successive zooms? I think this is less of a coding question, and more of a math question as to how one can track and center on the click locations at multiple zoom levels.
Would love to hear your thoughts.
I then track a "zoom" variable that increments and decrements with right and left mouse clicks, respectively. This variable is fed to the scale function, and results in the map being zoomed via clicking.
However, I would like the zoom to be centered around the click of the last mouse point. This is easy to do on a single click, as you just modify the translate arguments. However, as the clicks continue, and the zoom becomes higher, it becomes difficult to calculate the "layered" zooms that all involve a centered click at different levels of scale.
Does anyone have any insight on how to zoom on a clicked point, but keep re-centering on successive zooms? I think this is less of a coding question, and more of a math question as to how one can track and center on the click locations at multiple zoom levels.
Would love to hear your thoughts.
1