Question

我在http://arquitectospelomundo.com运行此网站，该网站基于googlemap。感谢这个社区，我已经设法让它从xml文件中读取数据，将其处理成一个markerclusterer对象，并使其显示带有内容的侧边栏。现在我想看看是否可以仅使用屏幕上显示的标记来过滤侧边栏（放大将从该列表中删除项目）。已经尝试过没有成功，因为markerclusterer给了我一个艰难的时间。任何帮助赞赏。谢谢！

Answer 1

观察地图的bounds_changed事件，然后循环标记并检查地图的边界是否包含标记：

google.maps.event.addListener(map,'bounds_changed',function(){
var bounds=map.getBounds();
$('#side_bar a').each(function(i,e){
  $(e).add($(e).next('br'))
    .css('display',(bounds.contains(gmarkers[i].getPosition()))?'block':'none');
});
});

这将过滤sidebar-elements，但lazyload不会注意到更改。但是你可以通过触发scroll事件来强制lazyload加载图像：

google.maps.event.addListener(map,'bounds_changed',function(){
var bounds=map.getBounds();
$('#side_bar a').each(function(i,e){
  var c=bounds.contains(gmarkers[i].getPosition());
  $(e).add($(e).next('br')).css('display',c?'block':'none')
   .find('img').trigger((c)?'scroll':'void');
});
});

使用markerclusterer过滤googlemaps，仅显示屏幕上可见的标记（在侧边栏上） - 通过xml加载的内容

1 个答案: