UNCG-DAISY / Coastal-Image-Labeler

Labeling Coastal Images
https://uncg-daisy.github.io/Coastal-Image-Labeler/
MIT License
8 stars 1 forks source link

Hover zoom #193

Open ebgoldstein opened 3 years ago

ebgoldstein commented 3 years ago

e.g.,

https://www.npmjs.com/package/react-cursor-zoom

https://www.npmjs.com/package/react-image-zoom

https://www.npmjs.com/package/react-inner-image-zoom

ebgoldstein commented 3 years ago

@ShahNafisRafique - asking for your opinion - do you think this is an easy thing to integrate? and do you have any insight into which implementation might be best for this project?

ShahNafisRafique commented 3 years ago

@ebgoldstein I think the first two are best.

The first one is nice cause the zoomed in portion follows the mouse The second is nice cause it shows what part of the image is zoomed in with the grey part The third one will probably mess up with the drawing tool too much.

If I had to pick one, I would probably say the 1st since it would require slightly less UI changes/thinking as the second would require some area to be designated to show the zoomed in portion

The 2 hardest things to do are 1) get the image size (which is already done) and 2) making it work with the scribble.

I don't think the scribble will cause any issues though, but thats the only thing I can see going wrong.

ebgoldstein commented 3 years ago

thx for the guidance @ShahNafisRafique !