after playing with OSM some while now i have a (for me) huge problem.
i add several markers to a map and add those markers popups.
my problem is now, that all popups appear at the same time when i click on one marker. but only the attached popup shoudl be shown.
my code:
function setMarker(lon, lat, count){
var icon = new OpenLayers.Icon("/src/includes/lib/map/export_badge.php?number="+count);
var lonLatMarker = new OpenLayers.LonLat(lon, lat).transform(map.displayProjection, map.projection);
markers.addMarker(new OpenLayers.Marker(lonLatMarker, icon));
markers.addMarker(new OpenLayers.Marker(lonLatMarker, icon.clone()));
var popupId = "popup_"+Math.random(100);
var popup = new OpenLayers.Popup.AnchoredBubble(popupId, lonLatMarker,
new OpenLayers.Size(200,20),
"Hello World ... "+popupId,
null, true,closePopUp);
//popup.closeOnMove = true;
map.addPopup(popup);
popup.hide();
map.events.register('click', lonLatMarker, function(){popup.show();});
}
function closePopUp(){
this.hide();
}
The function provided above – function setMarker(lon, lat, count) – is very similar to code for Google Maps API. I’ve worked with markers/popups with Google Maps for quite a while. But I can’t figure out how to make markers and popups work with OSM.
In the function above, the last line is “markers.addMarker(marker)”. The variable “markers” is not declared within this function. Could you share what the variable “markers” should be? I tried this but could not get the “markerClick” function to fire:
if (markersLayer == null) {
markersLayer = new OpenLayers.Layer.Markers("Markers");
map.addLayer(markersLayer);
}