Skip to content
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

Feature Request: Change visible portion of the map #49

Open
nikischin opened this issue Oct 2, 2023 · 3 comments
Open

Feature Request: Change visible portion of the map #49

nikischin opened this issue Oct 2, 2023 · 3 comments

Comments

@nikischin
Copy link
Contributor

I would like to change the visible portion of the map after the map initially rendered.

https://github.com/Nicolapps/mapkit-react/blob/main/support.md#visible-portion-of-the-map-1

One example where this could be useful:
I render a map with only one marker, which is draggable.
On dragEnd, I would like to update the center of the map to be the position of the moved marker. Also I might want to adjust the zoom level and zoom back to the default level after the user finished moving the marker. I would like to also have the option to decide, if this changes happen with a animation of not.

https://developer.apple.com/documentation/mapkitjs/map/2973936-setregionanimated

@Nicolapps
Copy link
Owner

I have the same need in one of my projects (CMU Map), and I implement it using the map ref:

https://github.com/Nicolapps/cmumap/blob/9c056c88687b3da5f27bf0ccb1fa7c2ea6213105/src/pages/%5B%5B...slug%5D%5D.tsx#L71

This works well for my use case. One other way that this could be implemented would be for mapkit-react to export its own functions through the ref, alongside the mapkit.Map object, but this would likely necessitate a breaking API change on our side (users of mapkit-react would need to change the way that they access the mapkit.Map ref).

Do you have some needs that would better be addressed if mapkit-react exposes its own methods for some actions, instead of letting the user use the ones from MapKit JS? One thing that would be better is if there is a need some day to support React Native through the same API, but this is not something that exists currently.

@nikischin
Copy link
Contributor Author

I have the same need in one of my projects (CMU Map), and I implement it using the map ref:

https://github.com/Nicolapps/cmumap/blob/9c056c88687b3da5f27bf0ccb1fa7c2ea6213105/src/pages/%5B%5B...slug%5D%5D.tsx#L71

This works well for my use case. One other way that this could be implemented would be for mapkit-react to export its own functions through the ref, alongside the mapkit.Map object, but this would likely necessitate a breaking API change on our side (users of mapkit-react would need to change the way that they access the mapkit.Map ref).

Do you have some needs that would better be addressed if mapkit-react exposes its own methods for some actions, instead of letting the user use the ones from MapKit JS? One thing that would be better is if there is a need some day to support React Native through the same API, but this is not something that exists currently.

Hi @Nicolapps thank you so much for your example! This does indeed looks quite nice already. However, working with states instead of refs is in lot cases more straightforward and improves readability of large code bases a lot. Therefore I would prefer, to add a option to directly allow passing the properties to the and listen for their updates.

I did a sample implementation in #50, not saying that this is the way to do, though you get a good idea, of how I thought to implement this. The regionUpdateAnimates is definitely something we could discuss, and also the usage of the functions in the useEffects, but I would prefer having something quite similar.

@passatgt
Copy link

This works also:

mapRef.current?.setCenterAnimated(new window.mapkit.Coordinate(selectedPoint.lat, selectedPoint.lon));

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants