How to display city name received via ajax?

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));
}
});
 });
April 4th 20 at 13:04
2 answers
April 4th 20 at 13:06
Solution
let data = JSON.parse(xhr.response);
console.log(data.response.GeoObjectCollection.featureMember[0].GeoObject.name); // (description)

I gave an example with zero city ( [0] ), not 1, but four in the above response, see for yourself what you need first or at all.
April 4th 20 at 13:08
Solution
Logical next rasparennye data to pass to the handler that will retrieve a value (that comes string, object, array) and insert the desired element.

An example would be able to write if it was possible to see the respons.
@Ethelyn.Reinger,
{"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, Br tabeliyində olan Şəki şəhəri","kind":"area","Address":{"country_code":"AZ","formatted":"Azerbaijan, Respublika tabeliyində olan Şəki şəhəri","Components":[{"kind":"country","name":"Azerbaijan"},{"kind":"area","name":"br tabeliyində olan Şəki şəhəri"}]},"AddressDetails":{"Country":{"AddressLine":"Azerbaijan, Respublika tabeliyində olan şəhəri Şəki","CountryNameCode":"AZ","CountryName":"Azerbaijan","AdministrativeArea":{"AdministrativeAreaName":"br tabeliyində olan Şəki şəhəri"}}}}},"name":"br tabeliyində olan Şəki şəhəri","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 the Town of Sheki","kind":"locality","Address":{"country_code":"AZ","formatted":"Azerbaijan Town of Sheki","Components":[{"kind":"country","name":"Azerbaijan"},{"kind":"area","name":"br tabeliyində olan Şəki şəhəri"},{"kind":"locality","name":"Town of Sheki"}]},"AddressDetails":{"Country":{"AddressLine":"Azerbaijan Town of Sheki","CountryNameCode":"AZ","CountryName":"Azerbaijan","AdministrativeArea":{"AdministrativeAreaName":"br tabeliyində olan Şəki şəhəri","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"}}}]}}}


Need to remove LocalityName - Coy_Simonis commented on April 4th 20 at 13:11
@Ethelyn.ReingerThat won't write writes undefined - Coy_Simonis commented on April 4th 20 at 13:14
Here is a function that returns the desired value:
getTownName function(data) {
 // Translate the incoming JSON into an object
 let parsed = JSON.parse(data);

 // Get the object from the desired item and return
 return parsed.response.GeoObjectCollection.featureMember[1].GeoObject.name;
}

JSON is parsed right into her. Can modify to your taste:
  1. To write a function that directly outputs the name of the city in the DOM, pass the object to it and from it to call this function
  2. Or this function to alter so that it is the name of the city itself in the DOM return
- Ethelyn.Reinger commented on April 4th 20 at 13:17

Find more questions by tags AJAXJavaScriptYandex.Maps