eckige google maps rendert zwei Karten

Question

Ich benutze ui-gmap-google-map und ich versuche, die Grenzen der Karte auf die Marker, die ich habe, zu setzen. Dies funktioniert normalerweise, wenn der Abstand zwischen ihnen kurz ist. Aber wenn ich es mit einer größeren Entfernung zwischen den Markern mache, rendert die Map wie hier abgebildet, es sieht so aus, als ob es zwei Maps gerendert hätte. Es sieht auch so aus, als ob die Markierungen wiederholt werden und wieder rechts von der "Eck" -Karte beginnen.

Ich weiß für eine Tatsache, dass die Markierungen und die Koordinaten korrekt sind.

ich die Grenzen setze wie so in meinem Controller ...

uiGmapIsReady.promise(2).then(function(instances) { 
       instances.forEach(function(inst) { 
        var map = inst.map; 

        var bounds = new google.maps.LatLngBounds(); 
        for (var i in $scope.markers) { 
         bounds.extend(new google.maps.LatLng($scope.markers[i].coords.latitude, $scope.markers[i].coords.longitude)); 
        } 

        var fitBounds = new google.maps.LatLngBounds(); 
        fitBounds.extend(new google.maps.LatLng(bounds.getNorthEast().lat(), bounds.getNorthEast().lng())); 
        fitBounds.extend(new google.maps.LatLng(bounds.getSouthWest().lat(), bounds.getSouthWest().lng())); 

        map.fitBounds(fitBounds); 

       }); 
      }); 

und der html ...

<div class="map-container"> 
      <ui-gmap-google-map center="map.center" zoom="map.zoom" options="map.options" class="google-map"> 
       <ui-gmap-polyline path="map.path" stroke="map.stroke" fit="true"></ui-gmap-polyline> 
       <ui-gmap-marker ng-repeat="m in markers track by $index" idKey="m.id" options="m.options" coords="m.coords" events="m.events"></ui-gmap-marker> 
      </ui-gmap-google-map> 
     </div> 

Wenn ich nicht die Grenzen gesetzt, es macht in Ordnung, einfach auf einen scheinbar zufälligen Marker gezoomt. aber ich kann herauszoomen und es sieht gut aus, mit einer Karte.

Ich kann nichts über dieses spezifische Problem im Netz finden. Jede Hilfe wird geschätzt. So

Answer 1

ich es dachte, schließlich heraus ...

ich die anfängliche Zoomstufe 5 Einstellung hatte, als die Karte einrichten. dann eine fitBounds() -Funktion ausführen, die ich glaube, aktualisiert den Zoom auch.

Ich legte die anfängliche Zoomstufe auf 0 und dieses Problem ging weg.

var map = { 
         //zoom: 5, 
         zoom: 0, 
         center: [{ 
          latitude: $scope.journey.startCoordinate.lat, 
          longitude: $scope.journey.startCoordinate.lng 
         }, { 
          latitude: $scope.journey.endCoordinate.lat, 
          longitude: $scope.journey.endCoordinate.lng 
         }]};