角度谷歌地图 fitBounds答案

【问题标题】：Angular Google Maps fitBounds角度谷歌地图 fitBounds
【发布时间】：2017-10-09 18:35:40
【问题描述】：

我不知道如何从 angular-google-maps 实例调用 fitBounds()。我试图在 uiGmapGoogleMapApi 解析后调用它，但我不知道在哪里/如何访问此方法。从 vanilla js 实现中，您可以调用 map.fitBounds(bounds) 但我不确定 angular-google-maps v2.2.1 中的等价物是什么，感谢您的帮助。

编辑

我通过将 control 属性添加到 scope.map 并在 uiGmapIsReady 解析时调用 getGMap() 来实现此功能。

      uiGmapGoogleMapApi.then(function(maps) {
        scope.bounds = new maps.LatLngBounds();
        scope.map = {
          center: {
            latitude: 47.60427,
            longitude: -122.33825
          },
          zoom: 16,
          polys: [],
          bounds: {},
          control: {} // add this property

        };
        traceVehicle(scope.tripDetails);
      });
      // add uiGmapIsReady and call getGMap()
      uiGmapIsReady.promise(1).then(function(instances) {
        instances.forEach(function(inst) {
          var map = inst.map;
          var uuid = map.uiGmap_id;
          var mapInstanceNumber = inst.instance; // Starts at 1.
          var gMap = scope.map.control.getGMap(); // assign getGMap();
          gMap.fitBounds(scope.bounds);
        });
      });



  function traceVehicle(selectedTrip) {
    var rawPolys = [];
    var polylineObj = {
      id: 1,
      path: [],
      stroke: {
        color: '#6060FB',
        weight: 3
      },
      editable: false,
      draggable: false,
      geodesic: true,
      visible: true
    };
    scope.polylines = [];
    if(selectedTrip.locations.length > 0) {
      angular.forEach(selectedTrip.locations, function(v, i) {
        polylineObj.path.push({ latitude: v.lat, longitude: v.lon });
        scope.bounds.extend({ lat: v.lat, lng: v.lon });
      });
      rawPolys.push(polylineObj);
      scope.map = {
        center: {
          latitude: polylineObj.path[(Math.round(polylineObj.path.length/2) -1)].latitude,
          longitude: polylineObj.path[(Math.round(polylineObj.path.length/2) -1)].longitude
        },
        zoom: 16,
        polys: rawPolys
      };
      scope.map.fitBounds(scope.bounds); // how to call fitBounds()?

【问题讨论】：

scope.map 只是一个对象。您想为scope.map 创建一个google.maps.Map 对象。至少从你分享的 sn-p...

标签： angularjs google-maps

【解决方案1】：

您需要将$scope.map 用作谷歌地图对象。目前只是选项。

var mapOptions = {
    zoom: 16,
    polys: [],
    bounds: {},
    center: new google.maps.LatLng(47.60427, -122.33825),
    mapTypeId: google.maps.MapTypeId.TERRAIN
};

$scope.map = new google.maps.Map(document.getElementById('map'), mapOptions);
$scope.map.fitBounds(YOUR_CODE_FOR_BOUNDS);

【讨论】：