Feature Request: Scrollwheel zoom into point

[MattyBalaam]

As a user when I have my mouse cursor over a point on an image I would expect it to zoom into that point as the origin.

[ValentinH]

You are right, this would be nice. In the same idea, when zooming on mobile with 2 fingers, we should also use the center of the 2 points as the zoom origin.

This is more complex to compute but it's still doable. Would you like to implement this?

[MattyBalaam]

I started to take a crack earlier, but it may take a while for me to find the time to implement it well.

[ValentinH]

I'll try to look into this when I have a bit of time 🙂

[ValentinH]

@MattyBalaam Here's a first try, could you tell me if it matches what you meant? (only wheel is handled in this demo):
https://codesandbox.io/s/mj61vp82xp

[MattyBalaam]

I gave the PR a try and it works great on my mousewheel. Very nice work.

[ValentinH]

OK, I'll need to clean the code a bit and at least ensure that the zoom with pinch is still working. I could add the same feature for pinch later. 🙂

[ValentinH]

Actually, I just noticed that my PR works well if you didn't move the image before. If you moved it, then it's not working perfectly. I guess the crop position should be taken in to account as well.

[MattyBalaam]

Ah, yes. you shouldn’t rely on me as a tester that’s for sure.

[ValentinH]

No I think it's ready: https://codesandbox.io/s/mj61vp82xp.

It also handles mobile zoom too. :)

[MattyBalaam]

Just tried it on desktop and on my Android phone and it works brilliantly. Brilliant job.

[ValentinH]

Ok I'll release this later today once I'm on the computer :)

[ValentinH]

Released as v1.4.0: https://github.com/ricardo-ch/react-easy-crop/releases/tag/v1.4.0