Отладка передачи переменных Javascript - PullRequest
0 голосов
/ 25 апреля 2018

У меня есть карта Google, которая отображает маркеры с информацией о долготе и широте с веб-страницы, которая анализируется функцией makeRequest.На данный момент маркеры размещаются при вызове displayLocation путем вызова makeRequest.Точные маркеры, которые я хочу, размещены на карте.Моя проблема заключается в попытке предоставить более подробную информацию для информационного окна маркера карты.

Я не понимаю область действия переменной memberName.Когда я передаю memberName через вызов makeRequest, я получаю последнее имя memberName в массиве, который заполняется в информационном окне каждого маркера.

Половина моей цели завершена, где каждый маркер уникален для memberID (долго, лат).Я хочу перебрать другой массив с именами участников и заполнить их вместе с каждым соответствующим маркером.

Выход цикла отображает фамилию в массиве, в то время как он должен отображать значение по адресу memberNames [i] в ​​массиве, соответствующем первому циклу for.

                var participantIDs = <?php echo json_encode($participantIDs) ?>;
                var participantNames = <?php echo json_encode($participantNames)?>;

                var participantID;
                var participantName;

                for(var i = 0; i < participantIDs.length; i++)
                {
                    participantID = participantIDs[i];
                    participantName = participantNames[i];

                    makeRequest('pageWithLocationInfo.php?participantID=' + participantID , function(data) 
                    {
                        var data = JSON.parse(data.responseText);

                        for(var i = 0; i < data.length; i++) 
                        {
                            displayLocation(data[i], participantName);
                        }
                    });
                }
            }

              function displayLocation(location, pName) {

                var content = '<div class="infoWindow">' + '<p>' + pName + '<br/>' + 'Latitude: '  +  location.latitude
                + '<br/>' + 'Longitude: ' + location.longitude + '</p>'
                +  '</div>';

                }

Ответы [ 2 ]

0 голосов
/ 25 апреля 2018

Вы можете попробовать следующее и сказать мне, что вывод. Также необходимо знать, как makeRequest указывает на сбой.

var participantIDs = [];
var participantNames = [];

if(participantIDs.length!==participantNames.length){
  throw new Error("participants id's and names are not the same length");
}
Promise.all(
  participantIDs.map(//map names and id's to [[id,name],[id,name]]
    function(id,index){
      return [id,participantNames[index]]
    }
  ).map(
    function(idName){//in ES7 you can use ([id,name])=>new Promise...
      return new Promise(
        function(resole,reject){
          makeRequest(//What does makeRequest return to indicate failure?
            "pageWithLocationInfo.php?participantID=" + idName[0],
            function(data){
              resolve(data);
            }
          )
        }
      ).then(
        function(response){
          var data = JSON.parse(response.responseText);
          data.forEach(function(location){
            displayLocation(location, idName[1]);
          })
          return [data,idName];
        }
      )
    }
  )
).then(
  function(results){
    console.log("results is:",results)
  }
)
0 голосов
/ 25 апреля 2018

Похоже, вы хотите, чтобы каждая итерация имела отдельную привязку для participantID и participantName.Поскольку var имеет область действия функции и поднимается, вы должны использовать const или let.Или, что еще лучше, полностью избегайте циклов for и используйте forEach, который не требует ручной итерации и имеет автоматическую абстракцию.Попробуйте что-то вроде этого:

const participantIDs = <?php echo json_encode($participantIDs) ?>;
const participantNames = <?php echo json_encode($participantNames)?>;
participantIDs.forEach((participantID, i) => {
  const participantName = participantNames[i];
  makeRequest('pageWithLocationInfo.php?participantID=' + participantID, function(response) {
    const data = JSON.parse(response.responseText);
    data.forEach(item => displayLocation(item, participantName));
  });
});

Ужаснее решение было бы просто использовать let в ваших циклах, который имеет область видимости блока (с которой легко взаимодействовать), а не область действия функции (с которой сложнее взаимодействовать):

var participantIDs = <?php echo json_encode($participantIDs) ?>;
var participantNames = <?php echo json_encode($participantNames)?>;
for (let i = 0; i < participantIDs.length; i++) {
  const participantID = participantIDs[i];
  const participantName = participantNames[i];
  makeRequest('pageWithLocationInfo.php?participantID=' + participantID, function(dataR) {
    const data = JSON.parse(dataR.responseText);
    for (var j = 0; j < data.length; j++) {
      displayLocation(data[j], participantName);
    }
  });
}

Не используйте одно и то же имя переменной индекса итерации для внутреннего и внешнего цикла;используйте разные имена.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...