Focus map on click
Hi,
I have a map that displays more than one markers. When some of the marker coordinates change using 'didUpdateWidget' I update the markers and theirs new position is reflected on the map.
Is it possible that when one marker is clicked, map "focuses" on that marker and pans as markers position changes.
When user clicks on another marker, map pans to that marker and focuses.
When user clicks somewhere on the map, but not on the marker, maps loses focus. That means that when marker position changes it will not pan.
Kind regards,
Marko
Hi Marko,
Yes, it is possible to achieve the behavior you mentioned by using the focalLatLng property. This can be accomplished with the focalLatLng property of the MapZoomPanBehavior class in the Syncfusion Flutter Maps widget.
The focalLatLng property allows you to set a specific geographical point as the center of your map view. When a marker's position changes, you can update this property to ensure the map keeps that marker centered.
Therefore, when you tap on a marker, you can set that marker's coordinates as the focalLatLng value, This will dynamically pan the map to center on the marker. Additionally, you can increase the zoom level to provide a closer view of the selected marker. The map will then maintain focus on this marker and follow it as its position updates.
If you tap anywhere else on the map (not on a marker), you can reset the focal latitude and longitude to a default position or simply clear the "following" behavior. This ensures that when the positions of the markers change afterward, the map will remain stationary instead of panning to follow them.
The map features flexible zoom level control that enhances the user experience. When browsing the overall map, a lower zoom level provides a comprehensive view. When a marker is selected, the zoom automatically increases, offering a detailed focus on that specific location. This creates a smooth transition between general navigation and targeted viewing of important points on the map.
We have shared the sample based on your need you can modify. If you have further queries, please get back to us.
Regards,
Naveen K.
Attachment: forum_197179_1dd45fba.zip
Thank you
Hi Marko,
You are most welcome. Please get back to us if you need any other assistance. We are always happy to assist you.
Regards,
Naveen K.
To achieve map focus on marker clicks, use a listener for marker taps to update the map's center. Implement logic to reset focus when clicking outside markers, ensuring smooth panning.
Hi Andrea,
Thank you for your suggestion. Please feel free to reach out if you have any queries. We are always happy to assist.
Regards,
Maryline A.
