javascript - 使用 AJAX 动态更新谷歌地图

Question

我的数据库中有很多地址，我想将它们作为标记添加到 Google 地图中。我只想加载和添加地图上选定区域中的标记。如果地图被缩放或拖动，它应该更新地图上的标记。我怎么做？

首先十分感谢！

Answer 1

正如 Aristos 所说，标记将在对焦时自动显示。但是，如果我有无数的联系人，那么只有在需要时才这样做确实会更容易。

我的策略是：

• 跟踪您添加的地址 - 没有必要重复两次。

• 从地址中，获取 LatLng。

• 获取地图的当前边界（使用 getBounds() 获取当前显示的地图的最小/最大 LatLng）

• 检查地址的 LatLng 是否在边界内。

• 如果是，请添加标记。

环形

如果您确实有很多地址，您可能需要预取 LatLng 并将其存储在 SQL 表中。然后，您可以使用间隔查询表。

高温高压

编辑：一些代码。假设您有一个 Array() 标记，以及西北和东南边界，您可以这样做：

function filterMarkers(nw, se, myMarkers) {
  var north=nw.lat();
  var west=nw.lng();
  var south=se.lat();
  var east=se.lng();
  var isInsideBounds=[];
  for (var i in myMarkers) {
    if(myMarkers[i].position.lat()>=north && myMarkers[i].position.lat()=<south && myMarkers[i].position.lng()>=west && myMarkers[i].position.lng()=<east) {
      isInsideBounds.push(myMarkers[i]);
    }
  }
  return isInsideBounds;
}

Answer 2

为了管理大量标记，您肯定希望利用已经构建的基础设施来执行此操作。实际上，Google Developers 博客上有一篇很棒的文章讨论了流行的选项。

https://developers.google.com/maps/articles/toomanymarkers

Marker Clusterer 是一个非常常见的组件，当涉及到地图应用程序时，我到处都能看到它，并且似乎符合您正在寻找的要求。我还会看看 Fusion Tables，因为它使构建包含数千个位置的地图变得非常简单。