使用 AJAX 动态更新谷歌地图

Dynamicaly update Google maps with AJAX

本文关键字：谷歌地图 更新 动态 AJAX 使用      更新时间：2023-09-26

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

提前非常感谢！

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

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

标记聚类器是一个非常常见的组件，我在地图应用程序方面到处都能看到，并且似乎符合您正在寻找的要求。我还会看看Fusion Tables，因为它使构建具有数千个位置的地图变得非常简单。

正如阿里斯托斯所说，标记将在对焦时自动显示。但是，如果我有无数的联系人，那么仅在需要时才能做到这一点确实会更容易。

我的策略是：

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

  • 从地址中，获取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;
}
相关文章：