Только одно местоположение в массиве координат, отображаемое на карте

Question

У меня есть следующий код, который я ожидаю сбросить 3 балла на моей карте листовки. Как ни странно, он отображает только 3-е значение в массиве. Нет ошибок при входе в консоль. Любая помощь будет принята с благодарностью.

        var cities = ["Victoria", "Bettles", "Truth or Consequences"]; // cities to map

        // variable to hold number value of city population
        var cityPops = [92141, 13, 5948];

        // 2-D array of corresponding city coordinates -- getting this error here. "Uncaught TypeError: Cannot read property 'lat' of null". Only way I can get the marker to load is as a single point, not as a 2D array
        var cityCoords = [
          [48.430077, -123.353043],
          [66.905857, -151.533330],
          [33.1284, -107.25283]
        ];
        console.log(cityCoords);

        // boolean indicating whether the city is a capital or not
        var cityCapital = [true, false, false];
        // for loop with if statement indicating whether city s a capital or not
        for (var i = 0; i < cities.length; i++) {
          var cityName = cities[i];
          console.log(cityName)
          var cityPop = cityPops[i];
          console.log(cityPop)
          var cityCap = cityCapital[i];
          console.log(cityCap)
          var cityCoord = cityCoords[i];
          console.log(cityCoord)
          var nameAndPop = `<b>${cityName}</b><b>population:</b> ${cityPop}`;

          if (cityCap == true) {
            console.log(nameAndPop)
            console.log(cityCap, `is a capital city`);
          }
        }
        // build a string with HTML tags and content
        var popup = `<b>${cityName}</b><br>
                    <b>population</b>: ${cityPop}<br>`
        { cityCap } `is a capital city`
        console.log(popup)

        // create a Leaflet marker
        // add it to the map
        // and bind the popup content to the marker.
        L.marker(cityCoord).addTo(map)
          .bindPopup(popup);```

Answer 1

for (var i = 0; i < cities.length; i++) {
        var cityName = cities[i];
        console.log(cityName)
        var cityPop = cityPops[i];
        console.log(cityPop)
        var cityCap = cityCapital[i];
        console.log(cityCap)
        var cityCoord = cityCoords[i];
        console.log(cityCoord)
        var nameAndPop = `<b>${cityName}</b><b>population:</b> ${cityPop}`;
        var popup = `<b>${cityName}</b><br>
                    <b>population</b>: ${cityPop}<br>`
                    {cityCap} `is a capital city`
        if (cityCap == true) {
          console.log(nameAndPop)
          console.log(cityCap, `is a capital city`);
        }
}

Answer 2

1. Вы все oop
2. переводите текущие значения в cityName, cityPop et c
3. ваш l oop больше
4. cityName, cityPop et c имеют значения последнего элемента массива
5. , с которым вы работаете с popup только один раз.

Делает ли это имеет смысл?

Ответ: поместите свои var popup =... и другие строительные логики c в l oop, чтобы он работал столько раз, сколько элементов в массиве