home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติตำแหน่ง HTML DOM Geolocation

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

คุณสมบัติ

ต่อไปนี้เป็นคุณสมบัติตำแหน่ง -

หมายเหตุ − คุณสมบัติด้านล่างเป็นแบบอ่านอย่างเดียว -

คุณสมบัติ คำอธิบาย
position.coords เพื่อส่งคืนวัตถุพิกัดที่มีข้อมูล เช่น ละติจูด ลองจิจูด ระดับความสูง และความเร็วของอุปกรณ์บนโลก นอกจากนี้ยังมีค่าความแม่นยำที่อธิบายว่าการวัดมีความแม่นยำเพียงใดในหน่วยเมตร
position.timestamp เพื่อแสดงเวลาและวันที่ที่วัตถุตำแหน่งถูกสร้างขึ้น ส่งคืน DOMTimeStamp ที่แสดงถึงเวลานั้น

ไวยากรณ์

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

position.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 Geolocation

เมื่อคลิกปุ่มประสานงาน -

คุณสมบัติตำแหน่ง HTML DOM Geolocation

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

ขั้นแรกเราได้สร้างปุ่มประสานงานที่จะรันเมธอด 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;
}