HTML5 geolocation digunakan untuk menentukan lokasi posisi user. HTML5 ini bisa diajak kompromi, artinya selama pengguna tidak menyetujui, posisi tidak tersedia hal ini untuk menjaga privacy dari pengunjung.
Browser yang support HTML5 geolocation ini adalah internet explorer 9, Firefox, opera, chrome dan Safari. Namun dengan catatan, geolocation lebih akurat untuk perangkat yang dilengkapi dengan GPS seperti iphone. Gunakan metodegetCurrentPosition() untuk mendapatkan posisi pengguna.
Berikut ini adalah contoh sederhana dari menentukan garis lintang dan bujur dari posisi pengguna:
<!DOCTYPE html>
<html>
<body>
<p id=”lokasi”>Klik di sini untuk melihat koordinatmu:</p>
<button onclick=”getLocation()”>Cari Lokasi</button>
<script>
function getLocation()
{
navigator.geolocation.getCurrentPosition(showPosition);
}
function showPosition(posisi)
{
document.getElementById(“lokasi”).innerHTML=”Latitude: ” + posisi.coords.latitude +
“<br>Longitude: ” + posisi.coords.longitude;
}
</script>
</body>
</html>
<!DOCTYPE html>
<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:
Try This: 4 Langkah Mudah Belajar Cara Membuat Website, Langsung Praktek! KLIK DI SINI!.
x.innerHTML=”An unknown error occurred.”
break;
}
}
</script>
</body>
</html>
Penjelasan :
- Periksa apakahGeolocationdidukung
- Jika didukung, jalankan getCurrentPosition() method.Jika tidak,menampilkan pesankepada pengguna
- Jika getCurrentPosition() metodeini berhasil,ia mengembalikanobjekkoordinatdengan fungsiyang ditentukan dalamparameter (showPosition)
- TheshowPosition() fungsimendapatkandisplay dariLintang danBujur
0 comments:
Post a Comment