Javascript Mapbox是否仅添加最后一个标记？

我正在使用mapbox并在地图上放置几个标记。我的代码 看起来像这样：

add.locations.forEach((location) => {
    console.log(location.long + " " + location.lat);
    // add marker to map
    let marker = new mapboxgl.Marker(el)
        .setLngLat([location.long, location.lat])
        .setPopup(popup)
        .addTo(this.map);

    this.markers.push(marker);
});

当我查看控制台时，

console.log（location.long+“”+location.lat）具有2个不同的长和宽。但是在地图上只有最后一个位置/指针在那里

这里可能有什么问题？
看起来您对所有标记使用了相同的
el
容器，因此在每次循环后，新标记将覆盖上一个标记（因此只剩下最后一个）

您应该为每个标记创建一个容器：

add.locations.forEach((location) => {

  // create a HTML element for each feature
  const el = document.createElement('div');

  // make a marker for each feature and add to the map
  const marker = new mapboxgl.Marker(el)
    .setLngLat([location.long, location.lat])
    .setPopup(popup)
    .addTo(this.map);

  this.markers.push(marker);
});