retyui/react-quick-pinch-zoom

Calling alignCenter for the second time

motro opened this issue · 4 comments

motro commented

Hi there,

First of all, thanks for the great package!

I'm trying the following:

  1. Calling alignCenter with my X and Y where I just clicked and a scale of 2 - works great.
  2. After another click, calling alignCenter again with different X and Y values but the same scale which results in a weird positioning of the center.

What would be the correct way to align the center again to a different point using the same scale?

@motro
Can you create a demo on codesandbox to see your problem

motro commented

I will, but if it makes any sense the problem is when I use the alignCenter method after I've zoomed in.

motro commented

@retyui see a demo here: https://codesandbox.io/embed/ryfcx
what I'm trying to do is to zoom to the point where I clicked, looks like something is lost in translation between the different coordinates systems (SVG/DOM).

motro commented

I had solved it :) all I needed was to set the viewBox of the SVG to the viewport size instead of the image size.