同一个地方有多个标记 - MarkerClusterer

Posted

技术标签:

【中文标题】同一个地方有多个标记 - MarkerClusterer【英文标题】:More than one marker on same place - MarkerClusterer 【发布时间】:2013-12-27 17:52:23 【问题描述】:

我正在使用 MarkerClusterer。当我在完全相同的位置有两个或多个标记时,API 仅显示 1 个标记 - 顶部的一个。但不知何故,我想显示所有标记,因为每个标记都会打开不同的弹出窗口。 我搜索了几个解决方案,但似乎没有一个有效 有人有类似的问题,请分享解决方案吗??

【问题讨论】:

Integrating Spiderfier JS into markerClusterer V3 to explode multi-markers with exact same long / lat 的可能重复项 @geocodezip 有没有办法让它在不使用 OverlappingMarkerSpiderfier 的情况下工作,因为它不能满足需要。以很小的空间显示两个标记只是为了知道有两个或更多标记就可以了。谢谢。 当然有。只需对其进行编码即可。或者更改输入数据,使之没有重复。 我和格里什在一起。这不是重复的,因为它没有提及或打算使用 OverlappingMarkerSpiderfier。 我的解决方案只是在我的地图上的每个标记上添加少量随机噪声(可能在任一方向 +-50 英尺),而不是尝试确定哪些位于彼此之上并且只移动那些。像魅力一样工作。 【参考方案1】:

那些在 android 中寻找相同解决方案的人 -

问题 - https://github.com/googlemaps/android-maps-utils/issues/384 解决方案 - https://github.com/menismu/android-maps-utils/blob/master/demo/src/com/google/maps/android/utils/demo/ClusteringSameLocationActivity.java

或者,如果您只想在单击标记时显示一个列表,请执行以下操作 -

clusterManager.setOnClusterClickListener 
            if (googleMap?.maxZoomLevel == googleMap?.cameraPosition?.zoom) 
                val items = it.items.map  assetItem -> assetItem.title 
                MaterialAlertDialogBuilder(requireContext())
                    .setTitle("Choose an asset")
                    .setItems(items.toTypedArray())  dialog, which ->
                        dialog.dismiss()
                        onItemClicked(it.items.elementAt(which))
                    
                    .show()
                return@setOnClusterClickListener true
            
            return@setOnClusterClickListener false
        

【讨论】:

【参考方案2】:

MarkerClusterer 可以选择定义 maxZoom 到哪个集群应该在地图中可见。您可以将其值设置为 18,这样当用户放大到最大时它不会显示集群:

 const markerCluster = new MarkerClusterer(map, markers,maxZoom: 18);

【讨论】:

这感觉比对我应用随机噪声要好 这对我来说也比随机化解决方案更好,但它只解决了问题,即从某个缩放级别显示标记而不是集群。但是,如果您希望将标记显示为单独的(和可点击的)标记以显示信息窗口,那么随机化解决方案就是要走的路。 所以,在使用这个之后,我看到一个标记而不是集群。我只能点击第一个,其他的都是隐藏的。不是解决方案。【参考方案3】:

仅供参考 - 精度

decimal places  decimal degrees N/S or E/W at equator
2   0.01    1.1132 km
3   0.001   111.32 m
4   0.0001  11.132 m
5   0.00001 1.1132 m

【讨论】:

【参考方案4】:

终于搞定了。这适用于所有尚未找到解决方案的人。下面的代码为同一位置的标记添加偏移量:

在您的 createMarker 函数中添加以下代码:

//get array of markers currently in cluster
var allMarkers = namespace.mapParams.mapMarkersArray;

//final position for marker, could be updated if another marker already exists in same position
var finalLatLng = latlng;

//check to see if any of the existing markers match the latlng of the new marker
if (allMarkers.length != 0) 
    for (i=0; i < allMarkers.length; i++) 
        var existingMarker = allMarkers[i];
        var pos = existingMarker.getPosition();

        //if a marker already exists in the same position as this marker
        if (latlng.equals(pos)) 
            //update the position of the coincident marker by applying a small multipler to its coordinates
            var newLat = latlng.lat() + (Math.random() -.5) / 1500;// * (Math.random() * (max - min) + min);
            var newLng = latlng.lng() + (Math.random() -.5) / 1500;// * (Math.random() * (max - min) + min);
            finalLatLng = new google.maps.LatLng(newLat,newLng);
        
    

Refer this

现在为每个标记更新您的 google.maps.Marker 对象,使用新的位置值 - finalLatLng

var marker = new google.maps.Marker(
    map: msf_namespace.mapParams.resultmap,
    position: finalLatLng,
    title: name,
    icon: markericon
);

//add each generated marker to mapMarkersArray
namespace.mapParams.mapMarkersArray.push(marker);

【讨论】:

我更喜欢你的方法而不是爬虫技巧,但我想知道你正在使用多少个标记,你是否注意到放置速度变慢了?

以上是关于同一个地方有多个标记 - MarkerClusterer的主要内容,如果未能解决你的问题,请参考以下文章

需要在全国地图上做标记。多个城市

使用 Javascript 在多个地方应用一个类

分布式--锁

分布式锁全网最详解!!

分布式锁看这篇就够了

vue高德地图 如何一次添加多个点标记到地图实例?