0

我需要在我的地图上放置几个标记,还需要在其中一个上显示信息窗口。所有这些东西都应该在地图视口内。我正在尝试使用此代码来获取 InfoWindow 左上角、右上角和 2 个标记的边界:

function calculateWaypointsBounds(attraction, destination, client, infoBox, map){

  const bounds = new google.maps.LatLngBounds();
  bounds.extend(new google.maps.LatLng(attraction.lat, attraction.lon));
  bounds.extend(new google.maps.LatLng(client.lat, client.lon));
  bounds.extend(new google.maps.LatLng(destination.lat, destination.lon));

  const div = infoBox.content_;

  const projectionCoords = infoBox.getProjection().fromLatLngToContainerPixel(new google.maps.LatLng(attraction.lat, attraction.lon));
  const leftTop = new google.maps.Point(projectionCoords.x - div.offsetWidth / 2, projectionCoords.y - 400);
  const rightTop = new google.maps.Point(projectionCoords.x + div.offsetWidth / 2, projectionCoords.y - 400);
  const ltCoords = infoBox.getProjection().fromContainerPixelToLatLng(leftTop);
  const rtCoords = infoBox.getProjection().fromContainerPixelToLatLng(rightTop);

  bounds.extend(ltCoords);
  bounds.extend(rtCoords); //InfoWindow always shows above marker, so i'm need only top left and top right corners.



  return bounds;
}

但看起来我的想法是错误的。我该怎么做呢 infoWindow 和我的 2 个标记总是在地图视口内。

4

1 回答 1

2
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markers.length; i++) {
    bounds.extend(markers[i].getPosition());
}

维护数组中所有标记的列表(在 :: 标记上方)。继续扩展循环中所有标记的边界,然后使用以下代码将其应用于地图对象:

mapObject.fitBounds(bounds);

这将自动使地图缩小以适合您的所有标记及其 infoWindows。希望这可以帮助你....

于 2016-06-07T09:04:55.713 回答