MarkerManager可见标记

时间:2015-07-02 10:03:04

标签: jquery google-maps google-maps-api-3 markermanager

我使用MarkerManager v3和谷歌地图来显示很多标记。现在一切都很完美,但我似乎无法找到一种方法来只显示markermanager正在显示的标记。我知道方法getMarkerCount返回缩放中可见标记的数量,但我需要来自id,title等标记的信息来更新包含dragend-event上的点的表。

我试过

    google.maps.event.addListener(map, "dragend", function() {
        for(var i = gMarkers.length, bounds = map.getBounds(); i--;) {
            if( bounds.contains(gMarkers[i].getPosition()) ){
                console.log(gMarkers[i].getVisible());
            }
        }
    });

此方法返回所有标记,即使它们在当前缩放级别不可见? 知道如何实现这个目标吗?

更准确地说,请参阅我的测试网站http://frankmyhre.dk/mapping/test.php,其中表格应反映地图内可见的标记(红色图标)

1 个答案:

答案 0 :(得分:1)

我认为我的解决方案是"快速而肮脏"。我认为通过使用插件应该可行。

无论如何,结果就是你所需要的,我想。 我展示的代码是在initialize中; 1个额外的功能和zoom_changed和dragend的替换

google.maps.event.addListener(map, "zoom_changed",function() {
  var zoom = map.getZoom();
  $('#zoom').text(zoom);
  $('#marker_count').text(mgr.getMarkerCount(zoom));
  timer = setTimeout(visibleMarkersInTable, 400);
});
google.maps.event.addListener(map, "dragend", function() {
  timer = setTimeout(visibleMarkersInTable, 400);
});
var timer; 
function visibleMarkersInTable () {
  clearTimeout(timer);  // make sure you don't check, while the user is panning or zooming.; so this blocks a lot of temporary checks
  $('table tbody').empty();
  for (i in gMarkers) {
    var markerVisible = gMarkers[i].map ? true : false;
    if(markerVisible) {
      // mind you, the marker might be on the map, but just outside of the boundaries.
      // so let's check those
      if (map.getBounds().contains(gMarkers[i].getPosition()) ) {
        $('table tbody').append('<tr id="' + gMarkers[i].id + '"><td>' + gMarkers[i].title + '</td><td>' + gMarkers[i].getPosition().lat() + '</td><td>' + gMarkers[i].getPosition().lng() + '</td></tr>');
      }
    }
  }
}

随意篡改setTimeout中的400ms延迟;把它设置为适合你的任何东西。 特别是当你有数百个标记时。不知道这会有多慢。