คุณสมบัติพิกัดตำแหน่งทางภูมิศาสตร์ HTML DOM

คุณสมบัติพิกัดพิกัด HTML DOM ใช้สำหรับรับตำแหน่งอุปกรณ์ของผู้ใช้และระดับความสูงบนโลก ผู้ใช้ต้องอนุมัติว่าเขาต้องการให้พิกัดก่อนที่คุณสมบัตินี้จะทำงานได้ สิ่งนี้ทำเพื่อไม่ให้ความเป็นส่วนตัวของผู้ใช้ถูกบุกรุก สามารถใช้ติดตามตำแหน่งของอุปกรณ์ต่างๆ ได้

คุณสมบัติ

ต่อไปนี้เป็นคุณสมบัติพิกัด -

หมายเหตุ - คุณสมบัติทั้งหมดเหล่านี้เป็นแบบอ่านอย่างเดียวและประเภทการส่งคืนเป็นสองเท่า

Sr.No	คุณสมบัติ &คำอธิบาย
1	พิกัด.ละติจูด วิธีคืนค่าละติจูดของตำแหน่งอุปกรณ์เป็นองศาทศนิยม
2	พิกัด.ลองจิจูด วิธีคืนค่าลองจิจูดของตำแหน่งอุปกรณ์เป็นองศาทศนิยม
3	พิกัด.altitude เพื่อคืนความสูงของตำแหน่งเป็นเมตร สัมพันธ์กับระดับน้ำทะเล สามารถคืนค่า null ได้หากไม่มี GPS ในอุปกรณ์
4	coordinates.accuracy เพื่อคืนค่าความถูกต้องของคุณสมบัติละติจูดและลองจิจูดในหน่วยเมตร
5	พิกัด.ระดับความสูงความแม่นยำ หากต้องการคืนค่าความถูกต้องของคุณสมบัติระดับความสูงเป็นเมตร
6	พิกัด.หัวเรื่อง เพื่อย้อนกลับทิศทางที่อุปกรณ์กำลังเคลื่อนที่ ค่านี้ ซึ่งระบุเป็นองศา แสดงว่าอุปกรณ์อยู่ห่างจากทิศเหนือจริงแค่ไหน 0 องศาแทนทิศเหนือจริง และทิศทางถูกกำหนดตามเข็มนาฬิกา (ตะวันออกคือ 90 องศา และตะวันตกคือ 270 องศา) ถ้าความเร็วเป็น 0 ส่วนหัวจะเป็น NaN หากอุปกรณ์ไม่สามารถให้ข้อมูลส่วนหัวได้ ค่านี้เป็นโมฆะ
7	พิกัด.speed เพื่อส่งคืนความเร็วของอุปกรณ์เป็นเมตรต่อวินาที ค่านี้สามารถเป็นค่าว่างได้

ไวยากรณ์

ต่อไปนี้เป็นไวยากรณ์สำหรับคุณสมบัติพิกัด GeoLocation -

coordinates.property

“พร็อพเพอร์ตี้” อาจเป็นหนึ่งในคุณสมบัติข้างต้นที่กล่าวถึงในตาราง

ตัวอย่าง

ให้เราดูตัวอย่างคุณสมบัติพิกัดตำแหน่งทางภูมิศาสตร์ -

<!DOCTYPE html>
<html>
<body>
<h1>Geolocation coordinates property</h1>
<p>Get you coordinates by clicking the below button</p>
<button onclick="getCoords()">COORDINATES</button>
<p id="Sample">Your coordinates are:</p>
<script>
   var p = document.getElementById("Sample");
   function getCoords() {
      if (navigator.geolocation) {
         navigator.geolocation.getCurrentPosition(showCoords);
      } else {
         p.innerHTML ="This browser doesn't support geolocation.";
      }
   }
   function showCoords(position) {
      p.innerHTML = "Longitude:" + position.coords.longitude + "<br>Latitude: " + position.coords.latitude+"<br>Accuracy: "+ position.coords.accuracy;
   }
</script>
</body>
</html>

ผลลัพธ์

สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -

คุณสมบัติพิกัดตำแหน่งทางภูมิศาสตร์ HTML DOM

เมื่อคลิกปุ่มประสานงานและคลิกอนุญาตในป๊อปอัป "รู้จักตำแหน่งของคุณ" -

คุณสมบัติพิกัดตำแหน่งทางภูมิศาสตร์ HTML DOM

ในตัวอย่างข้างต้น −

ขั้นแรกเราได้สร้างปุ่มประสานงานที่จะรันเมธอด getCoords() เมื่อผู้ใช้คลิก -

<button onclick="getCoords()">COORDINATES</button>

ฟังก์ชัน getCoords() รับคุณสมบัติการระบุตำแหน่งทางภูมิศาสตร์ของวัตถุเนวิเกเตอร์เพื่อตรวจสอบว่าเบราว์เซอร์รองรับการระบุตำแหน่งทางภูมิศาสตร์หรือไม่ หากเบราว์เซอร์รองรับการระบุตำแหน่งทางภูมิศาสตร์ เบราว์เซอร์จะส่งคืนวัตถุตำแหน่งทางภูมิศาสตร์ การใช้เมธอด getCurrentPosition() ของคุณสมบัติตำแหน่งทางภูมิศาสตร์ของเนวิเกเตอร์ เราจะได้ตำแหน่งปัจจุบันของอุปกรณ์ เมธอด getCurrentPosition() เป็นฟังก์ชันเรียกกลับ และนำฟังก์ชันเป็นอ็อบเจ็กต์สำหรับพารามิเตอร์ เนื่องจากทุกฟังก์ชันเป็นอ็อบเจ็กต์ใน JavaScript

ที่นี่ เราได้ส่งเมธอด showCoords() ไปให้ เมธอด showCoords() ใช้อินเทอร์เฟซตำแหน่งเป็นพารามิเตอร์ และใช้เพื่อแสดงลองจิจูด ละติจูด และความแม่นยำภายในย่อหน้าที่มีรหัส "ตัวอย่าง" ใช้คุณสมบัติ innerHTML ย่อหน้าเพื่อต่อท้ายข้อความ -

function getCoords() {
   if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(showCoords);
   } else {
      p.innerHTML ="This browser doesn't support geolocation.";
   }
}
function showCoords(position) {
   p.innerHTML = "Longitude:" + position.coords.longitude + "<br>Latitude: " + position.coords.latitude+"<br>Accuracy: "+ position.coords.accuracy;
}