HTML5 มีความสามารถในการหาค่าพิกัดทางภูมิศาสตร์ หรือ Geolocation ของอุปกรณ์ที่ใช้ในการเข้าเว็บ กรณีที่เข้าเว็บด้วย Smart Phone หรือ Tablet ที่มี GPS อยู่ในเครื่อง พิกัดที่ได้ก็จะเป็นตำแหน่งที่อ่านค่าได้จาก GPS ของเครื่องเลย แต่หากอุปกรณ์ที่ใช้ไม่มีระบบ GPS ค่าพิกัดที่ได้จะเป็นการนำค่าบางอย่างเช่น IP Address MAC Address ไปค้นหาตำแหน่งจากฐานข้อมูลอีกทีว่าค่าดังกล่าวมีการบันทึกตำแหน่งพิกัดไว้ที่ใด
แต่เนื่องจาก W3.ORG ผู้กำหนดมาตรฐาน HTML5 เห็นว่า ข้อมูลนี้อาจละเมิดความเป็นส่วนตัว จึงกำหนดให้ผู้ผลิตเบราเซอร์ ต้องแจ้งเตือนให้ผู้ใช้ทราบก่อนว่า จะมีการอ่านค่าตำแหน่งพิกัด ซึ่งผู้ใช้มีสิทธิที่จะเลือกว่าที่จะส่งค่าตำแหน่งพิกัดของตนหรือไม่ก็ได้
การประยุกต์ใช้เทคนิค Geolocation ที่เห็นได้ชัดก็คือ บริการบนโทรศัพท์มือถือรู้ได้อย่างไรว่าเราอยู่ที่ไหน ตรงไหนบนโลกนี้ เปิดแผนที่ปุ๊ป สามารถ Mark จุดได้เลย หรือบางเว็บไซต์ที่มีการสมัครสมาชิก ก็ได้มีการใช้เทคนิค Geolocation โดยตั้งค่ามาตรฐานให้วิ่งไปที่ จังหวัด หรือ ประเทศที่คนๆนั้นกำลังทำการสมัครอยู่
ตัวอย่าง การแสดงพิกัดแบบ latitude และ longitude
<html>
<body>
<p id="demo">หาตำแหน่งของฉัน</p>
<button onclick="getLocation()">คลิก</button>
<script>
var x=document.getElementById("demo");
function getLocation()
{ if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); }
else{x.innerHTML="Geolocation is not supported by this browser.";} }function showPosition(position)
{ x.innerHTML="Latitude: " + position.coords.latitude + "<br>Longitude: " + position.coords.longitude; }
</script>
</body>
</html>
โค๊ด HTML5 ในการหาพิกัดตามตัวอย่างข้างบนนี้ สามารถใช้หาพิกัด latitude และ longitude โดยเมื่อเรียกแล้ว ในครั้งแรกเบราเซอร์จะถามถึงการอนุญาต share location ก็ให้เรากดแชร์ไป และก็รอสักพัก ข้อมูลต่างๆจะโผล่ขึ้นมาใต้คำว่าตำแหน่งของฉัน:
ตัวอย่าง ในกรณีที่เราต้องการแสดงค่าError หากไม่สามารถหาพิกัดได้ <โดยเติมโค๊ด function showError(error)>
<html>
<body>
<p id="demo">Click the button to get your coordinates:</p>
<button onclick="getLocation()">Try It</button>
<script>
var x=document.getElementById("demo");
function getLocation()
{ if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition,showError); }
else{x.innerHTML="Geolocation is not supported by this browser.";} }
function showPosition(position) { x.innerHTML="Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude; }
function showError(error)
{ switch(error.code) { case error.PERMISSION_DENIED:
x.innerHTML="User denied the request for Geolocation."
break; case error.POSITION_UNAVAILABLE:
x.innerHTML="Location information is unavailable."
break; case error.TIMEOUT:
x.innerHTML="The request to get user location timed out."
break; case error.UNKNOWN_ERROR:
x.innerHTML="An unknown error occurred." break; } }
</script>
</body>
</html>
จากตัวอย่างข้างบนเป็นโค๊ดสำหรับแสดงค่า error ซึ่งจะแสดงให้เห็นค่า error ก็ต่อเมื่อไม่สามารถหาพิกัดได้เท่านั้น