Question

我使用Leaflet作为视口构建了一个桌面游戏的在线版本。

我的来源： https://github.com/edenLOL/gotta-chug-em-all/tree/master

我想要实现的目标是蜘蛛网/展开彼此相同的方格上的标记，包括当它们相互移动时。

我使用https://github.com/jawj/OverlappingMarkerSpiderfier-Leaflet对标记进行Spiderfy，这些标记在点击标记时似乎有效。

但是，我总是需要这些标记，而不需要点击事件。所以我为蜘蛛侠对象（oms）设置了keepSpiderfied: true。

var options = {  //**spiderfier
   keepSpiderfied: true,
   nearbyDistance: 120
};
oms = new OverlappingMarkerSpiderfier(map, options); //**spiderfier

但这不起作用。我似乎无法将标记加载到蜘蛛状状态，它总是需要点击才能抓住它们。

对于上下文，标记是在用户看到地图之前在提示期间动态生成的。

('#playerIcons > table > tbody > tr > td').on('click', function(){
    pokemonSelected = $(this).attr('class');
    if ( !$(this).hasClass('pokemonSelected') ){
        playerArray[pokeCounter].pokemon = ''+ pokemonSelected +'';
        playerArray[pokeCounter].marker = L.marker([playerArray[pokeCounter].coords[0], playerArray[pokeCounter].coords[1]], {
                                                icon: window[pokemonSelected]
                                            }).addTo(map);
        oms.addMarker(playerArray[pokeCounter].marker)  //**spiderfier
        pokeCounter += 1;        
    } else {
        return false;
    };
});

我也尝试过使用Leaflet / Leaflet.markercluster。这在一定程度上起作用，并且在定义的缩放级别上标记标记，但是标记不会移动，并且彼此重叠。

我在这里错过了什么可能导致这些问题？我不介意使用Spiderfier或MarkerCluster，因为一旦问题得到解决，两者都应该能够提供我正在寻找的解决方案。

Spiderfier：标记需要自动蜘蛛

MarkerCluster：当蜘蛛从群集中移出时，标记物不会移动

注意：如果您决定打开index.html，请注意Pokemon主题歌将在页面加载后的后台自动播放（直到绘制地图），因此请检查您的音量：）< / p>

Answer 1

我使用firelet（'click'）从传单中解决了这样的问题。

scope.spiderMarker - 标记，我想要spidrefy。在你的情况下，我认为它的playerArray [pokeCounter] .marker

    try{
       scope.spiderMarker.fire('click')}
       catch (e) {
       console.log(e);
       };

Leaflet Spiderfier / MarkerCluster - 自动蜘蛛状动态标记

1 个答案: