Kemas kini: Oct 26, 2011
Latar Belakang
Geolocation merupakan satu API (Application Programming Interface) yang baru diperkenalkan dalam HTML 5 dan telah disokong oleh kebanyakan pelayar web yang ada sekarang. Sebelum saya pergi dengan lebih lanjut mengenai ciri baru ini, jika anda berminat untuk mengetahui dengan lebih lanjut berkenaan HTML 5, anda boleh merujuk artikel berikut untuk mendapatkan gambaran awal mengenainya:
HTML 5 versus XHTML 2
Idea disebalik Geolocatian ialah untuk mendapatkan maklumat lokasi dari sumber seperti GPS dan WiFI yang biasa didapati pada kebanyakan alatan bimbit sekarang (telefon mudah alih, PDA, komputer riba dan sebagainya). API Geolocation membolehkan pelayar mendapatkan maklumat mengenai lokasi anda dengan menyediakan antaramuka skrip untuk yang mudah seperti mengunakan fungsi getCurrentPosition() untuk mendapatkan latitude dan longitude lokasi anda.
Ini dapat memberi kelebihan kepada pembangun laman web untuk menyediakan kandungan laman yang bersesuaian dengan lokasi pelawat. Anda boleh mendapatkan spesifikasi lanjut berkaitan API Geolocation dari W3C di alamat ini:
http://www.w3.org/TR/2008/WD-geolocation-API-20081222
Perbandingan
Jadual di bawah meringkaskan perbezaan kaedah biasa menentukan lokasi dengan menggunakan alamat IP berbanding dengan menggunakan API Geolocation.
| API Geolocation | Kaedah biasa | |
|---|---|---|
| Teknologi |
Bergantung kepada jenis pelayar web. |
Alamat IP |
| Ketepatan | Sederhana tinggi | Sederhana |
| Kebenaran dari pengguna | Diperlukan | Tiada |
| Sokongan | Pelayar web yang menyokong HTML 5 | Semua |
Sokongan Pelayar
Sokongan untuk API Geolocation boleh didapati dari hampir semua pelayar yang menyokong HTML 5. Maklumat sokongan pelayar diringkaskan dalam jadual berikut:
| Pelayar | Sokongan API Geolocation |
|---|---|
| Firefox | Versi 3.5 dan ke atas |
| Chrome | Sokongan melalui Google Gear |
| Opera | Sokongan dalam nightly build (versi percubaan untuk pembangun) |
| Safari | http://my.opera.com/chooseopera/blog/2009/03/27/geolocation-enabled-opera-build |
| Internet Explorer | Sokongan melalui Google Gear untuk versi 7 ke atas |
Demo
Dalam demostrasi ini, saya menggunakan Google Map untuk memaparkan lokasi anda yang akan diakses oleh pelayar web menggunakan API Geolocation.
Anda boleh mencubanya sendiri dengan berpandukan kod HTML dan Javascript seperti yang ditunjukkan di bawah. Kod ini akan memaparkan lokasi anda dalam bentuk koordinat (latitud dan longitud). Koordinat ini boleh dipaparkan dalam bentuk peta dengan menggunakan Google Map seperti yang ditunjukkan dalam demo ini.
<html>
<head>
<title>Cubaan Geolocation</title>
</head>
<body>
<script language="Javascript">
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
papar(position.coords.latitude, position.coords.longitude);
});
}
else {
if (document.getElementById("geo")) {
document.getElementById("geo").innerHTML = "Pelayar web anda tidak menyokong Geolocation";
document.getElementById("geo").style.color = "#FF0000";
}
}
function papar(lat, longi) {
if (document.getElementById("geo")) {
document.getElementById("geo").innerHTML = "Latitude: " + lat + " Longitud: " + longi;
}
}
</script>
<div id="geo"></div>
</body>
</html>
Jika anda menggunakan Firefox versi 3.5 ke atas atau mana-mana pelayar web yg menyokong Geolocation, anda mungkin menyedari pelayar web anda mengeluarkan satu bar pemberitahuan seperti yang ditunjukkan dalam gambarajah di bawah ketika melayari halaman ini. Bar ini bertujuan untuk membolehkan anda memilih samada membenarkan pelayar web anda mengakses Geolocation ataupun tidak.
Jika anda membenarkannya, lokasi anda akan dipaparkan pada Google Map di bahagian bawah.
