-
-
Notifications
You must be signed in to change notification settings - Fork 126
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Make viewer stay inside SVG boundaries? #143
Comments
Without having any context how this lib actually does it: the |
I agree and I also need this feature, if I find some time I might implement it and create a PR |
It's a bit of a hack, but you catch pan events with I'm using it here to disable left/right pan (I've got the SVG width set to fill the viewer), then by working out the scaling factor, I can get the height of the scaled SVG (and then I take away the viewer height as the number basically refers to the top of the viewer window):
|
I started building this feature: https://codesandbox.io/s/react-svg-pan-zoom-testing-wm6ssl (and abandoned it, because it's not really a must-have for our app) But intercepting the value in |
I'm also looking forward to that feat. As it might be a must have for our app, may have a look if no one else has implemented it and if not requiring to much time to implement . EDIT: Think I've got basic implementation by listening to value changes and restricting depending on image displayed size
Link to working POC which may be updated later on: |
Hi,
Is it possible to restrict the viewer going outside the boundaries of the SVG element? I'd like to achieve a map-like behavior where you can navigate only inside the svg map. I thought preventPanOutside will do exactly that, but it lets the user drag the map till the corners of the viewer.
Could somebody point me in the right direction?
Thanks,
Abel
The text was updated successfully, but these errors were encountered: