HTML5 geopositioning
HTML5 Geolocation (geopositioning) digunakan untuk mencari lokasi pengguna.
Cari posisi pengguna
HTML5 Geolocation API untuk mendapatkan lokasi pengguna.
Mengingat fitur ini mungkin melanggar privasi pengguna, kecuali pengguna setuju jika tidak, informasi lokasi pengguna tidak tersedia.
Dukungan Browser
Internet Explorer 9 +, Firefox, Chrome, Safari dan dukungan Opera Geolocation (lokasi geografis).
Catatan: Geolocation (geopositioning) Untuk perangkat dengan GPS, seperti iPhone, geopositioning lebih akurat.
HTML5 - Gunakan penargetan geografis
Menggunakan metode getCurrentPosition () untuk mendapatkan lokasi pengguna.
Contoh berikut adalah contoh geolocation sederhana, pengguna dapat kembali ke lokasi lintang dan bujur:
contoh
Fungsi getLocation ()
{
jika (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition (showPosition);
}
lain
{
x.innerHTML = "Browser ini tidak mendukung mendapatkan lokasi.";
}
}
Fungsi showPosition (posisi)
{
x.innerHTML = "Lat:" + position.coords.latitude +
"Situs Bujur:" + position.coords.longitude;
}
Coba »
contoh analisis:
- Hal ini diuji untuk geopositioning
- Jika didukung, menjalankan () metode getCurrentPosition. Jika tidak, ini akan menampilkan pesan ke pengguna.
- Jika getCurrentPosition () berhasil, fungsi untuk mengembalikan parameter yang ditentukan dalam koordinat sasaran showPosition
- showPosition () fungsi mengambil dan menampilkan garis lintang dan bujur
Contoh di atas adalah script geopositioning sangat dasar, bebas dari kesalahan penanganan.
Penanganan Kesalahan dan ditolak
Parameter kedua getCurrentPosition () metode untuk penanganan kesalahan. Ini menentukan ketika fungsi get untuk menjalankan ketika lokasi pengguna gagal:
contoh
{
switch (error.code)
{
kasus error.PERMISSION_DENIED:
x.innerHTML = "user menolak untuk mendapatkan permintaan lokasi."
break;
kasus error.POSITION_UNAVAILABLE:
x.innerHTML = "informasi lokasi tidak tersedia."
break;
kasus error.TIMEOUT:
x.innerHTML = "lokasi Permintaan pengguna timed out."
break;
kasus error.UNKNOWN_ERROR:
x.innerHTML = "error tidak diketahui."
break;
}
}
Coba »
Kode kesalahan:
- Izin ditolak - pengguna tidak diperbolehkan geopositioning
- Posisi tidak tersedia - Tidak dapat mendapatkan posisi saat ini
- Timeout - Terlalu lama
hasil tampilan di peta
Untuk menampilkan hasil di peta, Anda perlu akses dapat menggunakan garis lintang dan bujur dari layanan peta, seperti Google Maps atau peta Baidu:
contoh
{
var latlon = position.coords.latitude + "," + position.coords.longitude;
var img_url = "http://maps.googleapis.com/maps/api/staticmap?center="
+ Latlon + "& zoom = 14 & size = 400x300 & sensor = false";
document.getElementById ( "mapholder") innerHTML = "<img src = '" + img_url + "'>" .;
}
Coba »
Pada contoh di atas, kita menggunakan garis lintang dan bujur data yang dikembalikan oleh posisi layar (menggunakan gambar statis) di Google Maps.
Script Google Maps
Link di atas menunjukkan kepada Anda bagaimana menggunakan script untuk menampilkan peta interaktif dengan spidol, zoom dan pilihan drag.
Untuk lokasi informasi yang diberikan
Halaman ini menunjukkan bagaimana untuk menampilkan lokasi pengguna pada peta. Namun informasi geolocation untuk lokasi tertentu juga sangat berguna.
contoh:
- Memperbarui informasi lokal
- Tampilan tempat tujuan sekitar pengguna
- sistem navigasi mobil interaktif (GPS)
getCurrentPosition () metode - Data pulang
T jika berhasil, metode getCurrentPosition () mengembalikan sebuah objek. Selalu kembali lintang, bujur dan akurasi properti. Jika tersedia, properti tambahan berikut dikembalikan.
| 属性 | 描述 |
|---|---|
| coords.latitude | 十进制数的纬度 |
| coords.longitude | 十进制数的经度 |
| coords.accuracy | 位置精度 |
| coords.altitude | 海拔，海平面以上以米计 |
| coords.altitudeAccuracy | 位置的海拔精度 |
| coords.heading | 方向，从正北开始以度计 |
| coords.speed | 速度，以米/每秒计 |
| timestamp | 响应的日期/时间 |
Geolocation objek - metode menarik lainnya
watchPosition () - Mengembalikan lokasi pengguna saat, dan terus kembali posisi diperbarui (seperti GPS pada mobil) saat pengguna bergerak.
clearWatch () - Berhenti watchPosition () metode
Contoh berikut menunjukkan metode watchPosition (). Anda memerlukan perangkat GPS yang akurat untuk menguji kasus (seperti iPhone):
contoh
Fungsi getLocation ()
{
jika (navigator.geolocation)
{
navigator.geolocation.watchPosition (showPosition);
}
lain
{
x.innerHTML = "Browser ini tidak mendukung mendapatkan lokasi.";
}
}
Fungsi showPosition (posisi)
{
x.innerHTML = "Lat:" + position.coords.latitude +
"Situs Bujur:" + position.coords.longitude;
}
Coba »