当地图设置了“限制”选项时,map.fitBounds 工作起来很奇怪

Fed*_*man 3 javascript google-maps google-maps-api-3

我在地图上有 2 个标记。我想在发生某些事件时使这两个标记在地图上可见。但是当我restriction在地图上添加选项时fitBounds不显示标记。当我删除restriction选项时,它似乎工作正常。这是示例代码:

var map, markers;

var locations = [{
    lat: 50.8503396,
    lng: 4.351710300000036
  },
  {
    lat: 49.9570366,
    lng: 36.3431478
  },
];

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    zoom: 1,
    center: {
      lat: -28.024,
      lng: 140.887
    },
    restriction: {
      strictBounds: true,
      latLngBounds: {
        north: 85,
        south: -85,
        west: -180,
        east: 180
      },
    },
  });

  markers = locations.map(function(location, i) {
    return new google.maps.Marker({
      position: location
    });
  });

  markers.forEach(function(marker) {
    marker.setMap(map);
  });
}


setTimeout(function() {
  var bounds = new google.maps.LatLngBounds();
  markers.forEach(function(marker) {
    bounds.extend(marker.position);
  });
  map.fitBounds(bounds);
}, 5000);
Run Code Online (Sandbox Code Playgroud)
#map {
  height: 400px;
}
Run Code Online (Sandbox Code Playgroud)
<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap">
</script>
Run Code Online (Sandbox Code Playgroud)

https://jsfiddle.net/fedman/6eoty0vm/

小智 5

虽然 google.maps.api 的这个错误仍然存​​在,但您可以将地图中心设置为边界中心作为解决方法。

map.fitBounds(bounds);
map.setCenter(bounds.getCenter());
Run Code Online (Sandbox Code Playgroud)