Set Google Maps bounds with angular-google-maps
If you're using angular-google-map's "markers" directive, just add the fit="true" attribute (ui-gmap-markers).
Example :
<ui-gmap-google-map center="map.center" zoom="map.zoom" options="map.options"> <ui-gmap-markers fit="true" models="markers" coords="'self'"></ui-gmap-markers></ui-gmap-google-map>
According to docs, directives bounds is slightly different with google maps bounds. You should explicitly set northeast
and southwest
attributes with their own latitude
and longitude
.
Below should work:
$scope.map.bounds = { northeast: { latitude: myBounds.getNorthEast().lat(), longitude: myBounds.getNorthEast().lng() }, southwest: { latitude: myBounds.getSouthWest().lat(), longitude: myBounds.getSouthWest().lng() }};