Openlayers - arrary of info into popupmarker

I have a connection to a database(db). I am getting the lon, lat and name from the db and stroing them:

while ($row_ChartRS = mysql_fetch_array($sql1))
{
$latitude=$row_ChartRS['latitude'];
$longitude=$row_ChartRS['longitude'];
$bus_name =$row_ChartRS['short_name'];
//echo  $latitude.'--'.$longitude.'<br>';
echo  $bus_name;

I then create a map to display the data. The markers are working fine for all lat, lon locations. Code:

function init()
  {

    projLonLat   = new OpenLayers.Projection("EPSG:4326");   // WGS 1984
    projMercator = new OpenLayers.Projection("EPSG:900913"); // Spherical Mercator

    overviewMap = new OpenLayers.Control.OverviewMap();

    //adding scale ruler
    scale = new OpenLayers.Control.ScaleLine();
    scale.geodesic = true; // get the scale projection right, at least on small

    map = new OpenLayers.Map('demoMap',
                             { controls: [ new OpenLayers.Control.Navigation(),    // direct panning via mouse drag
                                           new OpenLayers.Control.Attribution(),   // attribution text
                                           new OpenLayers.Control.MousePosition(),    // where am i?
                                           new OpenLayers.Control.LayerSwitcher(),    // switch between layers
                                           new OpenLayers.Control.PanZoomBar(),    // larger navigation control
                                           scale,
                                           overviewMap                             // overview map
                                         ]
                             }
                            );

    map.addLayer(new OpenLayers.Layer.OSM.Mapnik("Mapnik"));
    map.addLayer(new OpenLayers.Layer.OSM.Osmarender("Osmarender"));


    //Create an explicit OverviewMap object and maximize its size after adding it to the map so that it shows
    //as activated by default.
    overviewMap.maximizeControl();

    //Adding a marker
    markers = new OpenLayers.Layer.Markers("Vehicles");
    map.addLayer(markers);

    vectorLayer = new OpenLayers.Layer.Vector('Routes');
    map.addLayer(vectorLayer);

    for (k in Locations)
    {

    //adding a popup for the marker
    var feature = new OpenLayers.Feature(markers, new OpenLayers.LonLat(Locations[k].lon, Locations[k].lat).transform(projLonLat,projMercator));

    //true to close the box
    feature.closeBox = true;

    feature.popupClass = new OpenLayers.Class(OpenLayers.Popup.AnchoredBubble,
    {
      //create the size of the box
      'autoSize': true,
      'maxSize': new OpenLayers.Size(100,100)
    });

    //add info into box
    for (z in names)
    {
    feature.data.popup = new OpenLayers.Feature(new OpenLayers.LonLat(names[z]).transform(projLonLat,projMercator));

    }

    //puts a scroll button on box to scroll down to txt
    //feature.data.overflow = "auto";

    marker = feature.createMarker();
    marker.display(true);

    markerClick = function (evt) {
      if (this.popup == null) {
        this.popup = this.createPopup(this.closeBox);
        map.addPopup(this.popup);
        this.popup.show();
      } else {
        this.popup.toggle();
      }
      currentPopup = this.popup;
      OpenLayers.Event.stop(evt);
    };

    marker.events.register("mousedown", feature, markerClick);
    markers.addMarker(marker);
    map.setCenter(new OpenLayers.LonLat(Locations[k].lon, Locations[k].lat).transform(projLonLat,projMercator), zoom);

    var lonLat1 = new OpenLayers.LonLat(Locations[k].lon,Locations[k].lat).transform(new OpenLayers.Projection('EPSG:4326'), map.getProjectionObject());
    var pos2=new OpenLayers.Geometry.Point(lonLat1.lon,lonLat1.lat);
    points1.push(pos2);


    //Uncomment to put boxes in when map opens
    //feature.popup = feature.createPopup(feature.closeBox);
    //map.addPopup(feature.popup);
    //feature.popup.show()
      }

  var lineString = new OpenLayers.Geometry.LineString(points1开发者_Python百科);
  var lineFeature = new OpenLayers.Feature.Vector(lineString,'',style_green);
  vectorLayer.addFeatures([lineFeature]);
  map.setCenter(lonLat1,zoom);

  } //function

However the name in the popup marker is the same for all markers. i.e. the last name pulled from the db. Can anyone please help with this - I have spent 3 full days trying to fix it!

Thanks in advance!

---

A few comments:

1. The PHP code you’ve posted is completely irrelevant, since it’s not seen to be used anywhere.
2. The objects names and Locations aren’t declared anywhere in the code you posted. What do they contain?

3. In the code quoted below, you’re creating multiple new Feature objects, but you assign them all to the same property (thereby overwriting that property each time). Is that intentional?

   //add info into box
   for (z in names) {
       feature.data.popup = new OpenLayers.Feature(new OpenLayers.LonLat(names[z]).transform(projLonLat,projMercator));
   }
   

Edit: This does appear to be where it’s going wrong. You should remove the for...z loop, and replace it with the following code:

//add info into box
feature.data.popup = new OpenLayers.Feature(new OpenLayers.LonLat(names[k]).transform(projLonLat,projMercator));

Since in PHP, you’re using the same index ($v) to fill both arrays, it makes sense to use the same index to read them in javascript...

---

Aside from that, using the for...in loop on Javascript arrays is not considered good practice, for a number of reasons. It’s better to use the following:

for (k = 0; k < Locations.length; k += 1) {
    // your code
}

---

i had the same problem , and i solve it ... the problem is overwrite you don't have to loop inside your function , do the loop for function for example:

function init(z)
{
    feature.data.popup = new OpenLayers.Feature(new OpenLayers.LonLat(names[z]).transform(projLonLat,projMercator));
}


for (z in names)
{
    init(z)
}