如何在谷歌地图 v3 中显示/隐藏 MarkerCluster?
-
27-09-2019 - |
题
我需要针对不同的情况使用不同的标记 mapType
s,我正在推动他们 标记聚类器.
我用以下方法“隐藏”标记:
cluster.set("map", null);
cluster.resetViewport();
cluster.redraw();
并“展示”它们:
cluster.set("map", MAP);
cluster.resetViewport();
cluster.redraw();
问题是 MarkerClusterer 似乎不喜欢 set("map", null)
;它抛出错误 TypeError: Object #<a MarkerClusterer> has no method 'remove'
. 。我怎样才能以正确的方式显示/隐藏它们?
解决方案 5
我通过一点猴子补丁和一点黑客努力解决了这个问题。我仍在等待一个明确的答案,但这 是 解决我的问题,所以我也发布这个:
MarkerClusterer.prototype.remove = function () {}
[..]
cluster.set("map", HIDDEN_MAP); // remove the clusterer
cluster.resetViewport();
cluster.redraw();
其他提示
清除集群的优雅方式
cluster.clearMarkers();
在 Javascript API v3 中,这样说就足够了:
clusterer.setMap(null);
如果将地图设置回现有地图对象,簇将重新出现。
clusterer.setMap( this.map );
另外,我建议不要将您的集群器命名为“集群”,就像您的示例中那样。MarkerClusterer 包含 Cluster 对象,它们是实际的聚类标记,而不是 ClusterER 本身。
这是一个更完整的解决方案:
在.html中添加:
<div id="map-canvas-hidden" style="display:none"></div>
<div id="map-canvas-shown" style="width:500px; height:500px"></div>
在.js中添加:
MarkerClusterer.prototype.remove = function() { };
var HIDDEN_MAP = new google.maps.Map(document.getElementById("map-canvas-hidden"), {});
var gmap = new google.maps.Map(document.getElementById("map-canvas-shown"), {});
显示集群:
cluster.setMap(gmap);
cluster.resetViewport();
cluster.redraw();
隐藏簇:
cluster.setMap(HIDDEN_MAP);
cluster.resetViewport();
cluster.redraw();
最后,我需要对markerclusterer.js进行以下补丁:
--- markerclusterer.js.orig 2013-12-06 18:02:32.887516000 +0100
+++ markerclusterer.js 2013-12-06 18:03:25.487516924 +0100
@@ -620,6 +620,7 @@
*/
MarkerClusterer.prototype.getExtendedBounds = function(bounds) {
var projection = this.getProjection();
+ if (!projection) return null;
// Turn the bounds into latlng.
var tr = new google.maps.LatLng(bounds.getNorthEast().lat(),
@@ -657,7 +658,7 @@
* @private
*/
MarkerClusterer.prototype.isMarkerInBounds_ = function(marker, bounds) {
- return bounds.contains(marker.getPosition());
+ return bounds ? bounds.contains(marker.getPosition()) : false;
};
希望这可以帮助
这是我的代码,用于轻松显示/隐藏地图上的集群(针对当前版本的 Maps API 和 JS-Cluster-Renderer 进行了更新)。谢谢加比。
MarkerClusterer.prototype.remove = function() {};
MarkerClusterer.prototype.hide = function() {
this.setMap(null);
this.resetViewport();
};
MarkerClusterer.prototype.show = function() {
this.setMap(map); // replace map with your reference to the map object
this.redraw();
};
// To hide the clusters:
cluster.hide();
// To show the clusters:
cluster.show();
不隶属于 StackOverflow