freeCodeCamp/curriculum/challenges/arabic/04-data-visualization/json-apis-and-ajax/get-geolocation-data-to-fin...

3.7 KiB

id title challengeType videoUrl localeTitle
587d7faf367417b2b2512be8 Get Geolocation Data to Find A User's GPS Coordinates 6 احصل على بيانات تحديد الموقع الجغرافي للعثور على إحداثيات نظام تحديد المواقع العالمي للمستخدم

Description

شيء آخر رائع يمكنك القيام به هو الوصول إلى الموقع الحالي للمستخدم. يحتوي كل متصفح على متصفح مدمج يمكن أن يوفر لك هذه المعلومات. سيحصل المستكشف على خطوط الطول والعرض الحالية للمستخدم. سترى مطالبة للسماح بهذا الموقع أو حظره من معرفة موقعك الحالي. يمكن إكمال التحدي في كلتا الحالتين ، طالما أن الرمز صحيح. عن طريق تحديد السماح ، سترى النص الموجود على هاتف الإخراج يتغير إلى خط العرض وخط الطول. هنا رمز يفعل هذا:
إذا (navigator.geolocation) {
navigator.geolocation.getCurrentPosition (الوظيفة (الموضع) {
document.getElementById ('data'). innerHTML = "latitude:" + position.coords.latitude + "<br> longitude:" + position.coords.longitude؛
})؛
}
أولاً ، يتحقق من وجود كائن navigator.geolocation . إذا حدث ذلك ، يتم getCurrentPosition الأسلوب getCurrentPosition على هذا الكائن ، والذي يبدأ طلبًا غير متزامن لموضع المستخدم. في حالة نجاح الطلب ، يتم تشغيل وظيفة رد الاتصال في الطريقة. تصل هذه الوظيفة إلى قيم كائن position لخط العرض وخط الطول باستخدام تدوين النقطة وتحديث HTML.

Instructions

أضف رمز المثال داخل علامات script للتحقق من الموقع الحالي للمستخدم وإدراجه في HTML.

Tests

tests:
  - text: ''
    testString: 'assert(code.match(/navigator\.geolocation\.getCurrentPosition/g), "Your code should use <code>navigator.geolocation</code> to access the user&#39;s current location.");'
  - text: يجب أن تستخدم شفرتك <code>position.coords.latitude</code> لعرض موقع خط العرض للمستخدم.
    testString: 'assert(code.match(/position\.coords\.latitude/g), "Your code should use <code>position.coords.latitude</code> to display the user&#39;s latitudinal location.");'
  - text: يجب أن تستخدم شفرتك <code>position.coords.longitude</code> لعرض الموقع الطولي للمستخدم.
    testString: 'assert(code.match(/position\.coords\.longitude/g), "Your code should use <code>position.coords.longitude</code> to display the user&#39;s longitudinal location.");'
  - text: يجب عليك عرض موقف المستخدم داخل عنصر div <code>data</code> .
    testString: 'assert(code.match(/document\.getElementById\(\s*?("|")data\1\s*?\)\.innerHTML/g), "You should display the user&#39;s position within the <code>data</code> div element.");'

Challenge Seed

<script>
  // Add your code below this line


  // Add your code above this line
</script>
<h4>You are here:</h4>
<div id="data">

</div>

Solution

// solution required