Spread the love
Sometimes, we want to center and zoom on displayed markers with Google Map API v3.
In this article, we’ll look at how to center and zoom on displayed markers with Google Map API v3.
How to center and zoom on displayed markers with Google Map API v3?
To center and zoom on displayed markers with Google Map API v3, we call the setCenter
and fitBounds
methods.
For instance, we write
const bounds = markers.reduce((bounds, marker) => { return bounds.extend(marker.getPosition());
}, new google.maps.LatLngBounds()); map.setCenter(bounds.getCenter());
map.fitBounds(bounds);
to create the bounds
with the marker
location.
Then we call setCenter
to center the map at the center of the bounds
.
And then we call fitBounds
to fit the map
to the bounds
.
Conclusion
To center and zoom on displayed markers with Google Map API v3, we call the setCenter
and fitBounds
methods.