谷歌地图Spiderfying标记和添加听众

我试图蜘蛛我的标记和添加听众给他们。 Spidefying的工作正常，这意味着我得到的重叠标记spiderfied但问题是，我似乎无法计算如何添加监听器到这些标记。换句话说，我尝试了以下内容：谷歌地图Spiderfying标记和添加听众

将oms.addListener()置于循环中。这样，一旦点击标记就会在同一个标记上打开所有infoWindow s，这并不令人愉快。
将oms.addListener()置于循环之外，就像OMS Git回购示例一样。 https://github.com/jawj/OverlappingMarkerSpiderfier/blob/gh-pages/demo.html。这样所有的标记都具有相同的infoWindow这是循环中的最后一个。

这是我的代码：

var iw = new google.maps.InfoWindow(); 
var oms = new OverlappingMarkerSpiderfier(carte, {keepSpiderfied:true}); 
oms.addListener('click', function(marker){ 
    iw.setContent(content); 
    iw.open(carte, marker); 
}); 
var markers =[]; 
var bounds = new google.maps.LatLngBounds(); 
if (response.length != 0) { 
    for (var i = 0 ; i < response.length; i++) { 
     var loc = new google.maps.LatLng(response[i].latlong[0], response[i].latlong[1]); 
     bounds.extend(loc); 
     var lemarqueur = new google.maps.Marker({ 
      position: loc, 
      title: response[i].title 
     }); 
     content = '<table><tr><td><img src="' 
     +response[i].image+'"/></td><td><p style="font-size: 13px">' 
     +response[i].title+'</p> <p style="font-size: 10px"><b>Artists:</b> ' 
     +response[i].artist+'<br><b>Date:</b> '+response[i].startDate+'<br>' 
     +response[i].address.name +' '+response[i].address.street + '<br>' 
     +response[i].address.postalcode +', '+response[i].address.city +', ' 
     +response[i].address.country 
     +'<br><a target="_blank" href =' 
     +response[i].url+'>More info</a></p></td></tr></table>'; 

     oms.addMarker(lemarqueur); 
     markers.push(lemarqueur); 
    }; 
    carte.fitBounds(bounds); 
    var markerCluster = new MarkerClusterer(carte, markers); 
    markerCluster.setMaxZoom(15); 
    markerCluster.setGridSize(40); 
    google.maps.event.addDomListener(window, 'load', initialiser);

所以我想知道我应该把addListener()块？

这是我已经在循环使用前，使用google.maps.event.addListener()，它工作得很好：

google.maps.event.addListener(lemarqueur, 'click', function() { 
    InfoWindow.open(carte, lemarqueur); 
});

我希望这个问题是清楚的是，在提前
感谢。

来源

2013-06-19 Hamed

这不是Spiderifier的问题，它是一个可以通过函数闭包（创建标记函数）很容易解决的问题。 http://stackoverflow.com/questions/4897316/google-maps-api-v3-infowindow-all-infowindows-displaying-same-content - http://stackoverflow.com/questions/3711700/all-infowindows-have-同样的数据 – geocodezip

@geocodezip - 其实我的代码有函数闭包，这意味着它像：'function createMarker（）; for（）{marker = createMarker;}'。但是为了简单起见，我在这里贴了这个东西，因为还有其他的东西在这里被忽略。 – Hamed

@geocodezip - 如果您可以请提供一个Spiderfying示例，其中有一个函数闭包并循环了一些JSON数据。这将非常感激。 – Hamed

oms.addListener()的行为与google.maps.event.addListener()的行为不同。所以我不知何故通过在for循环内使用原始google.maps.event.addListener()而不是oms.addListener()来工作。像这样：

var infoWindows = []; 

function closeInfoWindows(){ 
    var i = infoWindows.length; 
    while(i--){ 
     infoWindows[i].close(); 
    } 
} 

function newMarker(map, response, oms){ 
var loc = new google.maps.LatLng(response.latlong[0], response.latlong[1]); 
var marker = new google.maps.Marker({ 
    position: loc, 
    title: response.title 
}); 
oms.addMarker(marker); 
var WindowOptions = { content:'some desc...'};  
var InfoWindow = new google.maps.InfoWindow(WindowOptions); 
infoWindows.push(InfoWindow); 
google.maps.event.addListener(marker, 'click', function() { 
    closeInfoWindows(); 
    InfoWindow.open(carte, marker); // or this instead of marker 
}); 
return marker; 
} 


for (var i = 0 ; i < response.length; i++) { 
     markers.push(newMarker(map, response[i], oms)); 
    };

额外信用：geocodezip和 All infowindows have same data

工作示例可以在这里（我的应用程序）发现：concert-dacote.com

来源

2013-06-20 00:26:00 Hamed

OMS处理程序在每次点击时触发每个单点标记的点击事件......不确定我做错了什么，但是使用4k +标记它不会飞行。我甚至没有想过尝试恢复到香草点击处理程序，因为OMS文档说你必须使用它们，但是...... whaddaya知道吗？谢谢你的提示！ –

@AdrianGünter很高兴能有所帮助。我有完全相同的问题。 – Hamed

这里是另一种方法来增加听众的spiderfiered标记不适用于需要的环：

var oms = new OverlappingMarkerSpiderfier (...) ; 

// Create this function 
function addClickListenerToMarker(marker, onClickListener) { 
    oms.addListener('click', function (markerArg, eventArg) { 
     if (marker == markerArg) 
      onClickListener(marker, eventArg); 
    }); 
} 

// Add a click listener to your marker 
var myMarker = ... 
addClickListenerToMarker(myMarker, function (marker, event) { 
    alert('I have been clicked'); 
});

来源

2017-02-14 02:09:05 AnixPasBesoin

谷歌地图Spiderfying标记和添加听众

回答

相关问题