选择onchange应更改映射边界

select onchange should change map bounds

本文关键字：映射 边界 onchange 选择      更新时间：2023-09-26

我选择了一些区域（voivodship）-如果用户选择了任何区域-地图应该更改中心并缩放以最适合该区域。这就是理论。现在的代码：

controller.js:

KPNControllers.controller('branchesCtrl', ['$scope', 
  function branchesCtrl($scope) {
    $scope.voivodships = [
        {"name" : 'dolnośląskie', "bounds" : {
               "northeast" : {
                  "lat" : 51.8047592,
                  "lng" : 17.7989169
               },
               "southwest" : {
                  "lat" : 50.09634,
                  "lng" : 14.816831
               }
            }},
        {"name" : 'kujawsko-pomorskie', "bounds" : {
               "northeast" : {
                  "lat" : 53.7809988,
                  "lng" : 19.7618465
               },
               "southwest" : {
                  "lat" : 52.33079009999999,
                  "lng" : 17.2472673
               }
            }}];
   $scope.$watch('voivodship', function() {
      if ($scope.voivodship !== undefined) {
        console.log($scope.voivodship.bounds);
        $scope.bounds = new google.maps.LatLngBounds(new google.maps.LatLng($scope.voivodship.bounds.northeast),new google.maps.LatLng($scope.voivodship.bounds.southwest));
        console.log($scope.bounds);
        $scope.map.panToBounds($scope.bounds);
        $scope.map.fitBounds($scope.bounds);
      }
    })

partial/branches.html:

<select ng-model="voivodship" ng-options="voivodship.name for voivodship in voivodships" class="full-width"><option value="">-- wybierz województwo --</option></select>

不幸的是，地图并没有改变，控制台显示：

RangeError: Maximum call stack size exceeded

有什么想法吗？

首先，你不能使用$scope.voivodship.bounds.northmet作为LatLng的来源-这很好，但你必须使用新的google.maps.LatLng（$scope.voivodship.bound.northwat，$scope.foivodship.pound.north.lng）（也许有人可以让它变得更好？）

第二个-仔细查看doc-LatLngBounds构造函数：https://developers.google.com/maps/documentation/javascript/reference?hl=pl&csw=1#LatLngBounds

LatLng边界（sw？：LatLng，ne？：LatL ng）

首先是sw而不是ne——如果你做错了——它会把你送到太空；D

正确的代码：

 $scope.$watch('voivodship', function() {
    if ($scope.voivodship !== undefined) {
      $scope.bounds = new google.maps.LatLngBounds(new  google.maps.LatLng($scope.voivodship.bounds.southwest.lat,$scope.voivodship.bounds.southwest.lng), new google.maps.LatLng($scope.voivodship.bounds.northeast.lat,$scope.voivodship.bounds.northeast.lng));
        $scope.map.panToBounds($scope.bounds);
        $scope.map.fitBounds($scope.bounds);
  }}
相关文章：