2

我正在尝试使用 google maps api 制作地图,该地图显示来自 MySQL 数据库的大量标记。我几乎完成了 Google Maps API 教程 ( https://developers.google.com/maps/articles/phpsqlajax_v3?hl=de ) 中所写的所有操作。

我的问题:

我不想一次加载所有标记,而只想加载那些在我当前视图范围内的标记。

为此,我的“phpsqlajax_genxml.php”将当前视图的 4 个边缘作为 GET 变量。这很好用,但我不知道如何处理 javascript 部分。

我的第一次尝试是插入一个处理程序,当边界改变时更新地图:

google.maps.event.addListener(map, 'bounds_changed', function() {
  var bounds = map.getBounds();

  var swPoint = bounds.getSouthWest();
  var nePoint = bounds.getNorthEast();

  var swLat = swPoint.lat();
  var swLng = swPoint.lng();
  var neLat = nePoint.lat();
  var neLng = nePoint.lng();

  var qs = '&swLat=' + swLat + '&swLng=' + swLng + '&neLat=' + neLat + '&neLng=' + neLng;
  downloadUrl("./includes/phpsqlajax_genxml.php?sess=<?php print session_id(); 
                  ?>"+qs,function(data){

      var xml = data.responseXML;
      var markers = xml.documentElement.getElementsByTagName("marker");
      for (var i = 0; i < markers.length; i++) {
        var name = markers[i].getAttribute("name");
        var address = markers[i].getAttribute("address");
        var type = markers[i].getAttribute("type");
        var point = new google.maps.LatLng(
            parseFloat(markers[i].getAttribute("lat")),
            parseFloat(markers[i].getAttribute("lng")));
        var html = "<b>" + name + "</b> <br/>" + address;
        var icon = customIcons[type] || {};
        var marker = new google.maps.Marker({
          map: map,
          position: point,
          icon: icon.icon,
          shadow: icon.shadow
        });
        bindInfoWindow(marker, map, infoWindow, html);
      }
  });

但这会在我滚动地图时每毫秒更新一次地图。我怎样才能每秒更新一次?

主要问题是如何仅将新缓存插入地图并删除那些不在我视野中的缓存。我不知道该怎么做。

到目前为止,“DownloadUrl”功能每毫秒下载该区域中的每个缓存,还下载我已经下载的那些,因此您可能会在那里看到每个标记一千次。

有人可以帮帮我吗?:)

4

1 回答 1

2

可能有不同的方法,例如

  1. 始终请求给定边界的所有标记并删除所有先前添加的标记

  2. 仅请求您尚未获得的给定边界的标记。因此,您必须收集已在视图中绘制的标记(例如 ID)并将此列表作为参数传递给 PHP 脚本,以便此脚本可以使用该列表过滤查询中的标记(注意:您最好通过 POST 发送数据,否则您将很快达到 URL 长度的限制)

与删除不在视图中的标记有关:
当您确实必须删除视图外的标记时,我没有比迭代所有标记并删除(将地图属性设置为空)标记更好的主意不在地图范围内的(可以通过 确定LatLngBounds.contains()

监听器的另一个问题:你最好监听idle地图的 -event

于 2013-09-04T23:01:01.327 回答