設置谷歌地圖邊界與角谷歌地圖

我想設置邊界到谷歌地圖實例，但沒有成功。我正在使用AngularJS和angular-google-maps模塊。我最後的嘗試是：設置谷歌地圖邊界與角谷歌地圖

<div id="map_canvas"> 
    <ui-gmap-google-map 
     center="map.center" 
     zoom="map.zoom" 
     bounds="map.bounds" 
     options="options"> 

     <div ng-repeat="d in devicesMarkers track by d.id"> 

      <ui-gmap-marker 
       idkey="d.id" 
       coords="d.center" 
       options="d.options"> 
      </ui-gmap-marker> 
      <ui-gmap-circle 
       center="d.center" 
       stroke="d.circle.stroke" 
       fill="d.circle.fill" 
       radius="d.circle.radius" 
       visible="d.options.visible"> 
      </ui-gmap-circle> 

     </div> 

    </ui-gmap-google-map> 
</div>

在我app.js我寫道：

(...) 
.controller('TaihMapController', ['$scope', '$log', 'uiGmapGoogleMapApi', function($scope, $log, GoogleMapApi) { 
    $scope.devicesMarkers = devices; 
    $scope.map = { 
     center: { latitude: devices[0].center.latitude, longitude: devices[0].center.longitude }, 
     zoom: 12, 
     bounds: {} 
     // fit: true, 
    }; 
    GoogleMapApi.then(function(maps) { 
     $log.debug(maps); 
     var myBounds = new maps.LatLngBounds(); 
     for (var k = 0; k < devices.length; k++) { 
      var _tmp_position = new maps.LatLng(
       devices[k].center.latitude, 
       devices[k].center.longitude); 
      myBounds.extend(_tmp_position); 
     } 
    $scope.map.bounds = myBounds; 
    $scope.googleVersion = maps.version; 
    // $scope.bounds = myBounds; 
    // $scope.zoom = maps.getZoom(); 
    // maps.fitBounds(myBounds); 
    // $scope.bounds = maps.getBounds(); 

});

功能maps.fitBounds()不存在。我嘗試了$scope.map.bounds的方法，但沒有迴應我的想法。

來源

2015-04-06 Vitor Carvalho

採取看看[此]（https://github.com/angular-ui/angular-google-maps/blob/master /example/example.html）github，並嘗試搜索'bounds'，有很多相關的代碼段。 – bjiang

我讀了這個文件，但沒有成功。這個要點包含了新的方法（基於建議的文件）https://gist.github.com/vitorcarvalhoml/62f804cd197572f28079如何根據邊界設置map.center和map.zoom？ –

根據docs，指令邊界與谷歌地圖邊界略有不同。您應該明確地設置northeast和southwest屬性與他們自己的latitude和longitude。

下面應該工作：

$scope.map.bounds = { 
    northeast: { 
     latitude: myBounds.getNorthEast().lat(), 
     longitude: myBounds.getNorthEast().lng() 
    }, 
    southwest: { 
     latitude: myBounds.getSouthWest().lat(), 
     longitude: myBounds.getSouthWest().lng() 
    } 
};

來源

2015-09-11 08:57:37 Mehraban

並將這個值例如放在Angular的常量中 - 導致內部控制器在首次使用後停止工作。 –

如果您正在使用角谷歌地圖的「標誌」的指令，只需添加適合= 「true」屬性（UI-GMAP-標記）。

實施例：

<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>

來源： https://stackoverflow.com/a/29707965

來源

2016-03-16 12:01:42

設置谷歌地圖邊界與角谷歌地圖

回答

相關問題