For Loop Through Array Only Shows Last Value

For loop through Array only shows last value

Change your for loop:

for (i = 0; i <= (n-1); i++) {
    var list = names[i];
    var myList = document.getElementById("list");
    myList.innerHTML += "<li class='list-group-item' id='listItem'>"+ list + "</li>" + "<br />";
}

Use += instead of =. Other than that, your code looks fine.

For loop only shows last value in array

You are passing a single-element array several times instead of passing a single collection of coordinates.

Try creating a method of

indexToFeature(index) {
  const {longitude, latitude, userName, dateTimeCaptured} = index;
  return {
    "type": "Feature",
    "properties": {
      'description': "Dispatcher: " + userName + "\n" + "\Lng/Lat\:" + longitude + " / " + latitude + "\n" + "\StartTime\: " + dateTimeCaptured
    },
    "geometry": {
      "type": "Point",
      "coordinates": [longitude, latitude, userName, dateTimeCaptured]
    }
  };
}

Then your main body can simply be

this.map.getSource('data-source').setData({
    "type": "FeatureCollection",
    "features": this.overwatchTargets.map(indexToFeature)
});

to call setData once, converting the entire array of overwatchTargets into an array of features.

In forEach loop, only last value is shown

I think you should declare new XMLHttpRequest();
in each every forEach iteration:

first10.forEach(objs => {
 /*HERE*/ let object  = new XMLHttpRequest(); 
 object.open('GET', `https://collectionapi.metmuseum.org/public/collection/v1/objects/${objs}`, true);

otherwise you're re-assigning the new calls for the same object so you get the last one only.

---

Related Topics