javascript - 谷歌地图 API : how to tell if a marker is hidden by another marker?

标签 javascript google-maps google-maps-api-3

我有一张 map ,上面有根据数据库中的值以编程方式放置的标记。当您单击标记时,它将转到该位置的详细信息页面。

我的问题是,本地图充分缩小时,彼此足够接近的标记会显示为单个标记,实际上隐藏了一些标记。 有没有办法以编程方式判断一个标记是一组标记的一部分还是被其他标记隐藏/覆盖?

我的目的是为每个动态生成的标记执行类似的操作:

marker.addListener('click', function() {
    // if marker is not hiding any other markers
    window.location.href = markerURL;
    // else if it is hiding markers/is part of a group of markers
    map.setZoom(15);
    map.setCenter(marker.getPosition());
});

我已经检查了Marker API documentation ,但似乎找不到任何有用的方法。在我的例子中,getClickablegetVisible 始终返回 true,无论一个标记是否被另一个标记覆盖。有什么建议么?谢谢!

最佳答案

我最终选择了 MarkerClusterer解决我的问题。我希望有一个更简单的解决方案,但事实证明这毕竟非常简单。

我唯一需要添加到现有标记生成代码中的是一个列表:varmarkers = [];,然后我调用markers.push(marker); 我所有的标记。最后一步是创建一个新的 MarkerClusterer 对象:

var markerCluster = new MarkerClusterer(map, markers, options); 

MarkerClusterer 或多或少会处理其余部分(options 参数是可选的,但我用它来设置图像的路径并设置最大缩放级别)。现在,在以前我的标记彼此堆叠的情况下,无法在某些缩放级别查看或单击某些标记,而是看到一个簇,其中的数字表示该簇中标记的数量。单击群集图标将进一步放大,显示我的标记。

所有这一切都是按照 simple usage example 完成的在他们的 github 页面上,但他们有 pretty good documentation也。为了使其正常工作,我的大部分时间实际上都花在设计群集图标以匹配我网站的配色方案上......

enter image description here

关于javascript - 谷歌地图 API : how to tell if a marker is hidden by another marker?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38622450/

相关文章:

javascript - 如何结束()文件流

javascript - 为什么 Javascript 中不经常使用链表

google-maps - 地理编码 API key 应受服务器限制

javascript - 如何在 Google map 上获得平滑的标记(SVG 图标)?

google-maps-api-3 - Google Maps Api 机场搜索

javascript - 如何将功能关联到 google maps api 中的自定义控件?

asp.net 4.0 webforms - 如何以简单的方式将 ContentPlaceHolder1_ 排除在客户端 ID 之外?

java - 将 JS 变量传递给 java 类

javascript - Google map 区域边界

javascript - Google map - map 重新加载