Question

我正在使用Google Maps Javascript API渲染地图并在其上显示一组位置标记。减少通过AJAX请求返回的数据量，该请求获取我发送请求中的边界框坐标的位置，以仅返回可见位置。

我目前的代码如下：

google.maps.event.addListener(Map.map, "bounds_changed", function() {
  Map.bounds.north = Map.map.getBounds().getNorthEast().lat();
  Map.bounds.east  = Map.map.getBounds().getNorthEast().lng();
  Map.bounds.south = Map.map.getBounds().getSouthWest().lat();
  Map.bounds.west  = Map.map.getBounds().getSouthWest().lng();
  });

据我了解getBounds如何工作，应该在移动地图时更新Map.bounds（发送到服务器以检索数据）。但是，在创建地图时，我无法设置Map.bounds，因此对位置的初始请求失败。如果我在Map.map.getBounds之外拨打google.maps.event.addListener，我会收到getBounds未定义的错误。在用户与之交互之前，如何在地图加载后设置边界？

（除了"idle"之外，我还尝试"bounds_changed"并获得相同的结果）

Answer 1

Google Maps Javascript API基于事件。如果您在第一个bounds_changed事件触发前在地图上调用getBounds，则无法正常工作。第一次设置后的任何时间都可以使用。

示例：

＆＃13;

var map;

function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {
      lat: 42,
      lng: -72
    },
    zoom: 8
  });
}
google.maps.event.addDomListener(window, 'load', initMap);

＆＃13;

html,
body,
#map {
  height: 100%;
  width: 100%;
}

＆＃13;

<script src="https://maps.googleapis.com/maps/api/js"></script>
<input type="button" value="get bounds" onclick="document.getElementById('bounds').innerHTML = map.getBounds().toUrlValue(6);" />
<div id="bounds"></div>
<div id="map"></div>

＆＃13;

Google Maps JS API - 并不总是定义getBounds（）

1 个答案: