Penggunaan API Geolokasi HTML5 yang benar

Geolokasi adalah API Web dengan standar HTML5. Anda dapat menggunakannya untuk mendapatkan informasi lokasi terkini (koordinat) perangkat. API ini memiliki tiga metode: getCurrentPosition, watchPosition, dan clearWatch dua metode tersisa memerlukan Gunakan bersama-sama!

Pemeriksaan kompatibilitas peramban:

API dipublikasikan melalui objek navigator.geolocation. Hanya jika objek ini ada, layanan geolokasinya dapat digunakan.

 if (navigator.geolokasi) { // Kode penentuan posisi ditulis di sini} else { alert('Geolokasi tidak didukung di browser Anda')}

Dapatkan lokasi pengguna saat ini:

Gunakan metode getCurrentLocation untuk mendapatkan informasi lokasi pengguna. Metode ini memiliki tiga parameter:

 // Parameter inisialisasi opsi const = { // Akurasi tinggi: benar / salah aktifkan Akurasi Tinggi: benar, // Waktu maksimum untuk menunggu unit respons: batas waktu milidetik: 5 * 1000, // Lokasi cache terpanjang yang dapat diterima aplikasi Waktu maksimumAge: 0}// Fungsi panggilan balik sukses: data berisi informasi lokasi const handleSuccess = data => console.log(data)// Fungsi panggilan balik gagal: kesalahan berisi informasi kesalahan const handleError = kesalahan => console.log(error)if (navigator.geolocation) { // Kode penentuan posisi ditulis di sini navigator.geolocation.getCurrentPosition(handleSuccess, handleError, options)} else { alert('Geolokasi tidak didukung di browser Anda') }

Berikut kodenya dengan lebih detail:

 const handleSuccess = data => { const { coords, // Stempel waktu informasi lokasi // Stempel waktu ketika informasi lokasi berhasil diperoleh} = data const { akurasi, // Akurasi dari hasil yang dikembalikan (meter) ketinggian, // Relatif terhadap horizontal plane Altitude altitudeAccuracy, // Mengembalikan judul akurasi ketinggian (meter), // Arah perjalanan perangkat host, searah jarum jam dari lintang utara, // Lintang bujur, // Kecepatan bujur // Kecepatan perjalanan perangkat} = coords // Cetak dan lihat console.log('timestamp =', timestamp) console.log('accuracy =', akurasi) console.log('altitude =', altitude) console .log( 'altitudeAccuracy =', altitudeAccuracy) console.log('heading =', heading) console.log('latitude =', lintang) console.log('longitude =', bujur) console.log('speed =', speed)}const handleError = error => { switch (error.code) { case 1: console.log('Permintaan layanan lokasi ditolak') break case 2: console.log(' The informasi lokasi tidak dapat diperoleh untuk sementara') break case 3: console.log('Timeout to acquire information') break case 4: console.log('Unknown error') break }}const opt ​​​​= { // Akurasi tinggi: benar / salah aktifkan Akurasi Tinggi: benar, // Waktu maksimum untuk menunggu respons Satuan: milidetik batas waktu: 5 * 1000, // Usia maksimum lokasi cache yang ingin diterima aplikasi maksimumAge: 0} if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(handleSuccess) , handleError, opt) } else { alert('Geolokasi tidak didukung di browser Anda')}

Di atas adalah keseluruhan isi artikel ini, saya harap dapat bermanfaat untuk pembelajaran semua orang. Saya juga berharap semua orang mendukung VeVb Wulin Network.