Unduhan Web GPS Template Web GPS Template Web

Web GPS Template

Data situs web

1.0.0

Unduh

Templat-GPS-Web

Berencana membuat aplikasi hybrid? Berencana menggunakan GPS di dalamnya? Maka templat ini cocok untuk Anda!

Halaman yang akan diedit:

marker.js -> menyimpan penanda di dalam peta
nav-dialogs.js -> menyimpan metode yang digunakan oleh templat laci (bilah samping)
info.js -> menyimpan metode peristiwa yang digunakan saat pengguna mengklik atau mengetuk penanda di dalam peta
navigasi.js -> mengontrol kotak dialog yang digunakan oleh aplikasi
main.css -> tata letak halaman ini
templates.css -> beberapa pilihan desain (warna latar belakang) yang dimiliki oleh index.html dan halaman ini

Folder antarmuka web dibuat secara otomatis oleh plug-in qgis2web dari qgis. Jika Anda membuat peta baru dan menggunakan plugin qgis2web, template ini sangat kompatibel. Meskipun saya melakukan beberapa perubahan di dalam qgis2web.js untuk memenuhi mode manual (mengatur koordinat gps secara manual) jadi ingatlah hal itu ketika mengubah konten antarmuka web.

Templat ini tidak mencari atau membandingkan lokasi koordinat, tetapi Anda dapat membuatnya sendiri. Cukup gunakan metode Javascript ini untuk mendapatkan lokasi Anda saat ini.

Metode dan variabel JavaScript penting untuk digunakan:

geolocation.getPosition() -> Metode ini memberikan lokasi GPS pengguna saat ini
externalGeoLocate() -> Memperbarui lokasi GPS pengguna saat ini
manualcoords -> Koordinat GPS yang Anda atur secara manual. Hanya panggil variabel ini jika mode manual disetel ke true

Saya pikir OpenLayers (Yang membuat templat ini menjadi mungkin) memiliki metode tersendiri dalam membandingkan koordinat, Anda juga dapat menggunakannya!

Contoh kode untuk membandingkan dan mencari koordinat

  if ( typeof ( geolocation . getPosition ( ) ) === "undefined" && manualmode == false ) {
    return false ;
  }

  if ( manualmode ) {
    coords = manualcoords ;
  }
  else {
    coords = geolocation . getPosition ( ) ;
  }
  
  // Assume that we have a list of coordinates (objects that contain
  // x and y values). We compare each one of them using the classic
  // formula of [distance between two points]
  // (http://www.mathwarehouse.com/algebra/distance_formula/index.php) 
  // then push it to an array called selected
  for ( var i = 0 ; i < list . length ; i ++ ) {
    var icon = list [ i ] ;
    var dist = Math . sqrt ( Math . pow ( ( coords [ 0 ] - icon . x ) , 2 ) + Math . pow ( ( coords [ 1 ] - icon . y ) , 2 ) ) ;
    
    // If distance is close to the 2500m radius, then it is included
    if ( dist <= 2500 ) {
      selected . push ( icon ) ;
    }
  }