3.6 KiB
id, title, challengeType, forumTopicId, dashedName
id | title | challengeType | forumTopicId | dashedName |
---|---|---|---|---|
587d7faf367417b2b2512be8 | Отримання даних геолокації для знаходження GPS-координат користувача | 6 | 18188 | get-geolocation-data-to-find-a-users-gps-coordinates |
--description--
Інша зручна річ - доступ до поточної локації користувача. У кожен браузер вбудовано навігацію, яка надасть цю інформацію.
Навігація надає доступ до актуальної широти та довготи користувача.
Вам надійде запит на дозвіл або блокування доступу сайту до вашої локації. Завдання можна завершити будь-яким способом, якщо код буде правильним.
Якщо ви надасте доступ, побачите текст на телефоні виводу для зміни широти та довготи.
Ось такий код:
if (navigator.geolocation){
navigator.geolocation.getCurrentPosition(function(position) {
document.getElementById('data').innerHTML="latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude;
});
}
Спочатку перевіряється чи існує об'єкт navigator.geolocation
. Якщо так, то для об'єкта методом getCurrentPosition
буде асинхронно надіслано запит на локацію користувача. Якщо запит успішний, функція зворотного виклику під час роботи методу спрацює. Ця функція передає значення position
об'єкта для широти і довготи за допомогою крапкової нотації і оновлює HTML.
--instructions--
Додайте приклад коду у теґи script
, щоб дізнатись поточне розташування користувача і вставити його у HTML.
--hints--
Щоб дізнатись поточне місце розташування користувача, використайте navigator.geolocation
.
assert(code.match(/navigator\.geolocation\.getCurrentPosition/g));
Щоб відобразити координату широти місця знаходження користувача, використайте position.coords.latitude
.
assert(code.match(/position\.coords\.latitude/g));
Щоб відобразити координату довготи місця знаходження користувача, використайте position.coords.longitude
.
assert(code.match(/position\.coords\.longitude/g));
Положення користувача покажіть елементом id="data"
всередині div
.
assert(
code.match(/document\.getElementById\(\s*?('|")data\1\s*?\)\.innerHTML/g)
);
--seed--
--seed-contents--
<script>
// Add your code below this line
// Add your code above this line
</script>
<h4>You are here:</h4>
<div id="data">
</div>
--solutions--
<script>
// Add your code below this line
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
document.getElementById('data').innerHTML = "latitude: " + position.coords.latitude + "<br>longitude: " + position.coords.longitude;
});
}
// Add your code above this line
</script>
<h4>You are here:</h4>
<div id="data">
</div>
</section>