Angular Google Maps - automatically set 'center' and 'zoom' to fit in all markers

Question

I have a dynamically generated list of markers within my Google Map. I want the map\'s center to be the center of all the markers and zoomed out just enough so that all markers

Answer 1

Also use timeout to make sure it is digested properly

 uiGmapIsReady.promise()
          .then(function (map_instances) {
            var bounds = new google.maps.LatLngBounds();
            for (var i in $scope.map.markers) {
              var marker = $scope.map.markers[i];
  bounds.extend(new google.maps.LatLng(marker.latitude, marker.longitude));
            }

            $timeout(function() {
              map_instances[0].map.fitBounds(bounds);
            }, 100);
          });