The issue is that i only one popup on the map is dispalyed. I can see all the points but popup can see only on the last point of the list.
I'm stack with rhis problem from Sunday and can not find any info that could solve my problem on the internet :(
// create the layer
var vectorLayer = new OpenLayers.Layer.Vector("Venues");
// Define markers as "features" of the vector layer:
var feature = [];
for(var i = 0; i < 10; i++){
feature[i] = new OpenLayers.Feature.Vector(
new OpenLayers.Geometry.Point(value.location.lng, value.location.lat).transform('EPSG:4326', 'EPSG:3857'), {
description: "Name: " + Name + "<br>Address:" + value.location.address + "<br>Likes: " + value.likes.count + "<br>Here now: " + value.hereNow.count
}, {
fillColor: '#008040',
fillOpacity: 0.8,
strokeColor: "#ee9900",
strokeOpacity: 1,
strokeWidth: 1,
pointRadius: 8
}
);
vectorLayer.addFeatures(feature);
map.addLayer(vectorLayer);
//Add a selector control to the vectorLayer with popup functions
var controls = {
selector: new OpenLayers.Control.SelectFeature(vectorLayer, {
onSelect: createPopup,
onUnselect: destroyPopup
})
};
function createPopup(feature) {
feature.popup = new OpenLayers.Popup.FramedCloud("pop",
feature.geometry.getBounds().getCenterLonLat(),
null,
'<div class="markerContent">' + feature.attributes.description + '</div>',
null,
true,
function() {
controls['selector'].unselectAll();
});
//feature.popup.closeOnMove = true;
map.addPopup(feature.popup);
}
function destroyPopup(feature) {
feature.popup.destroy();
feature.popup = null;
}
map.addControl(controls['selector']);
controls['selector'].activate();
}
