MarkerManager 可见标记
MarkerManager visible markers
我正在使用 MarkerManager v3 和 google 地图来显示大量标记。现在一切都很完美,但我似乎无法找到一种方法来只显示 markermanager 正在显示的标记。我知道 getMarkerCount 方法 returns 缩放中可见标记的数量,但我需要来自标记的信息,如 id、标题等,以更新包含 [=20] 上的点的 table =].
我试过了
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());
}
}
});
此方法 returns 所有标记,即使它们在当前 zoom-level 时不可见?
知道如何实现吗?
更准确地说,请参阅我的 test-site http://frankmyhre.dk/mapping/test.php,其中 table 应反映地图上边界内可见的标记(红色图标)
我认为我的解决方案是 "quick and dirty"。我觉得应该是可以的,通过插件。
总之,我想结果就是你所要求的。
我展示的代码在初始化里面; 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 中的 400 毫秒延迟;将它设置为任何适合你的。
特别是当您有数百个标记时。不知道这会变得多慢。
我正在使用 MarkerManager v3 和 google 地图来显示大量标记。现在一切都很完美,但我似乎无法找到一种方法来只显示 markermanager 正在显示的标记。我知道 getMarkerCount 方法 returns 缩放中可见标记的数量,但我需要来自标记的信息,如 id、标题等,以更新包含 [=20] 上的点的 table =].
我试过了
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());
}
}
});
此方法 returns 所有标记,即使它们在当前 zoom-level 时不可见? 知道如何实现吗?
更准确地说,请参阅我的 test-site http://frankmyhre.dk/mapping/test.php,其中 table 应反映地图上边界内可见的标记(红色图标)
我认为我的解决方案是 "quick and dirty"。我觉得应该是可以的,通过插件。
总之,我想结果就是你所要求的。 我展示的代码在初始化里面; 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 中的 400 毫秒延迟;将它设置为任何适合你的。 特别是当您有数百个标记时。不知道这会变得多慢。