Как вывести название города полученный через ajax?

Question

[Ibishka]

navigator.geolocation.getCurrentPosition(pos => {
        let xhr = new XMLHttpRequest();
        xhr.open(
          "GET",
          `https://geocode-maps.yandex.ru/1.x/?apikey=6792a574-8840-4ac0-8a9f-e6b7d21a5f69&geocode=${pos.coords.longitude},${pos.coords.latitude}&format=json&kind=locality&lang=en-US`
        );
        xhr.send();
        xhr.addEventListener("load", () => {
          if (xhr.status == 200) {
            console.log(JSON.parse(xhr.response));
          }
        });
      });

Comments

[freeExec]

Вы не разобрались где в ответе лежит населённый пункт?

Answer 1

[Пашенька]

let data = JSON.parse(xhr.response);
console.log(data.response.GeoObjectCollection.featureMember[0].GeoObject.name); // (description)

Я привёл пример с нулевым городом ( [0] ), их там не 1, а четыре в вышеприведённом респонсе, смотрите сами, что вам нужно: первый или вообще все.

Answer 2

[Анатолий Куликов]

Логично далее распарсенные данные передать в обработчик, который извлечёт значение (из того, что приходит - строка, объект, массив) и вставит в нужный вам элемент.

Пример смог бы написать, если можно было увидеть респонс.

Comments

[Ibishka]

Анатолий Куликов,

{"response":{"GeoObjectCollection":{"metaDataProperty":{"GeocoderResponseMetaData":{"Point":{"pos":"47.176126 41.194147"},"request":"47.176126,41.194147","results":"10","found":"4"}},"featureMember":[{"GeoObject":{"metaDataProperty":{"GeocoderMetaData":{"precision":"other","text":"Azerbaijan, Respublika tabeliyində olan şəhəri Şəki","kind":"area","Address":{"country_code":"AZ","formatted":"Azerbaijan, Respublika tabeliyində olan şəhəri Şəki","Components":[{"kind":"country","name":"Azerbaijan"},{"kind":"area","name":"Respublika tabeliyində olan şəhəri Şəki"}]},"AddressDetails":{"Country":{"AddressLine":"Azerbaijan, Respublika tabeliyində olan şəhəri Şəki","CountryNameCode":"AZ","CountryName":"Azerbaijan","AdministrativeArea":{"AdministrativeAreaName":"Respublika tabeliyində olan şəhəri Şəki"}}}}},"name":"Respublika tabeliyində olan şəhəri Şəki","description":"Azerbaijan","boundedBy":{"Envelope":{"lowerCorner":"47.122601 41.156829","upperCorner":"47.207897 41.242156"}},"Point":{"pos":"47.168676 41.196616"}}},{"GeoObject":{"metaDataProperty":{"GeocoderMetaData":{"precision":"other","text":"Azerbaijan, Town of Sheki","kind":"locality","Address":{"country_code":"AZ","formatted":"Azerbaijan, Town of Sheki","Components":[{"kind":"country","name":"Azerbaijan"},{"kind":"area","name":"Respublika tabeliyində olan şəhəri Şəki"},{"kind":"locality","name":"Town of Sheki"}]},"AddressDetails":{"Country":{"AddressLine":"Azerbaijan, Town of Sheki","CountryNameCode":"AZ","CountryName":"Azerbaijan","AdministrativeArea":{"AdministrativeAreaName":"Respublika tabeliyində olan şəhəri Şəki","Locality":{"LocalityName":"Town of Sheki"}}}}}},"name":"Town of Sheki","description":"Azerbaijan","boundedBy":{"Envelope":{"lowerCorner":"47.122601 41.156829","upperCorner":"47.207897 41.242156"}},"Point":{"pos":"47.179411 41.203401"}}},{"GeoObject":{"metaDataProperty":{"GeocoderMetaData":{"precision":"other","text":"Azerbaijan, Şəki rayonu","kind":"area","Address":{"country_code":"AZ","formatted":"Azerbaijan, Şəki rayonu","Components":[{"kind":"country","name":"Azerbaijan"},{"kind":"area","name":"Şəki rayonu"}]},"AddressDetails":{"Country":{"AddressLine":"Azerbaijan, Şəki rayonu","CountryNameCode":"AZ","CountryName":"Azerbaijan","AdministrativeArea":{"AdministrativeAreaName":"Şəki rayonu"}}}}},"name":"Şəki rayonu","description":"Azerbaijan","boundedBy":{"Envelope":{"lowerCorner":"46.813725 40.767784","upperCorner":"47.604161 41.46343"}},"Point":{"pos":"47.166367 41.204168"}}},{"GeoObject":{"metaDataProperty":{"GeocoderMetaData":{"precision":"other","text":"Azerbaijan","kind":"country","Address":{"country_code":"AZ","formatted":"Azerbaijan","Components":[{"kind":"country","name":"Azerbaijan"}]},"AddressDetails":{"Country":{"AddressLine":"Azerbaijan","CountryNameCode":"AZ","CountryName":"Azerbaijan"}}}},"name":"Azerbaijan","boundedBy":{"Envelope":{"lowerCorner":"44.759538 38.393085","upperCorner":"51.0356 41.913526"}},"Point":{"pos":"47.651476 40.359953"}}}]}}}

Нужно извлечь LocalityName

[Ibishka]

Анатолий Куликов, Что не напишу пишет undefined

[Анатолий Куликов]

Вот функция, которая возвращает нужное значение:

function getTownName(data) {
    // Переводим приходящий JSON в объект
    let parsed = JSON.parse(data);

    // Достаем из объекта нужный элемент и возвращаем
    return parsed.response.GeoObjectCollection.featureMember[1].GeoObject.name;
}

JSON обрабатывается прямо в ней. Можете доработать по-своему вкусу:

1. Написать функцию, которая непосредственно выводит название города в DOM, передавать в нее объект и из нее вызывать данную функцию
   
2. Или данную функцию переделать таким образом, чтобы она название города сама в DOM возвращала