Анализ JSON для цикла и многоуровневого массива while приводит к неопределенности - PullRequest
Новая
       20

Анализ JSON для цикла и многоуровневого массива while приводит к неопределенности

0 голосов
/ 04 июня 2019

Мой скрипт проходит по разным объектам, но я получаю неопределенный результат из цикла for для массива изображений.

Данные JSON можно посмотреть здесь: https://michaelpmullally.com/map/map.json

Я пытался использовать разные типы циклов и пытаться создать отдельные переменные для каждого элемента в массиве. 

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
    var myObj = JSON.parse(this.responseText);
    console.log(myObj);
    for (i = 0; i < myObj.features.length; i++) {
        for (h = 0; h < myObj.features[i].image.length; h++) {
            var name = myObj.features[i].properties.name;
            var image = myObj.features[i].image[h]; //updated from answers !! JSON also updated
            while (h < 5) {
                var slidelink = `<a href="#` + name + `-slide-` + h + `">` + h + `</a>`;
                var slideimage = `<div class="slides">
                    <picture class="slide" id="` + name + `-slide-` + h + `">` + h + `">
                        <img src="` + image + `">
                    </picture>
                </div>`;
            }
            var slider = slidelink + slideimage;
        }
        var name = myObj.features[i].properties.name;
        var icon = myObj.features[i].properties.icon;
        var yelp = myObj.features[i].properties.yelp;
        var trip = myObj.features[i].properties.trip;
        var rating = myObj.features[i].properties.rating;
        var review = myObj.features[i].properties.content;
        document.getElementById("locations"+ i).innerHTML = `<header>
        <h2><i class="` + icon + `"></i> ` + name + `</h2>
        </header>
        <main>
            <section class="slider">`
                + slider +
           `</section> 
            <section class="review">
                <span>` + rating + `</span>
                ` + review + `
            </section>
        </main>
        <footer>
        <h2><a href="https://www.yelp.com/biz` + yelp + `"><i class="fab fa-yelp"></i></a>
        <a href="https://www.tripadvisor.com/` + trip + `"><i class="fab fa-tripadvisor"></i></a></h2>
        </footer>
        `;
    }
}
};
xmlhttp.open("GET", "map.json", true);
xmlhttp.send();

Верхний блок статьи выглядит так. https://michaelpmullally.com/map/test.html

Ответы [ 2 ]

0 голосов
/ 04 июня 2019

Я предполагаю, что вы, возможно, захотите использовать один из files, описанных в массиве images, если это так, вы должны 

// the index value h is on the image and not on the file
var image = myObj.features[i].image[h].file[0];  // you have misplaced your index `h`, also am simply placing the index 0 here for reference.

Также я не уверен, как и где вы обрабатываете различные файлы под изображениями, если вам нужно, то вам также нужно пройтись по files array

0 голосов
/ 04 июня 2019

Простая ошибка 

for (h = 0; h < myObj.features[i].image.length; h++) {  <-- looping over images
  var name = myObj.features[i].properties.name;
  var image = myObj.features[i].image.file[h];  <-- using index on file[h], not image[h]
...