Script PHP Based Location Geolocation Google Map

Script PHP Based Location Geolocation Google Map

Loading...
php_development

Script PHP Based Location Geolocation Google Map. Script Geolocation digunakan untuk menampilkan lokasi dimana kita sedang Online. Biasanya yang pakai Android ada GPS, nah untuk HTML5 yang dikombinasikan dengan PHP dengan Geolocation kita akan bisa mengetahui lokasi tempat kita Online dan ditampilkan di Peta dari data Google Map. Bagi yang belum mengetauhi cara menampilkan peta sederhana dan dasar bisa baca artikel saya sebelumnya yang berjudul Script PHP Menampilkan Peta Dasar Sederhana Google Map.

 

Nah berikut adalah Script PHP Based Location Geolocation Google Map dengan Javascript dan HTML5:

[php]
var map;

function initialize() {
  var mapOptions = {
    zoom: 6
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

  // Try HTML5 geolocation
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude,
                                       position.coords.longitude);

      var infowindow = new google.maps.InfoWindow({
        map: map,
        position: pos,
        content: 'Location found using HTML5.'
      });

      map.setCenter(pos);
    }, function() {
      handleNoGeolocation(true);
    });
  } else {
    // Browser doesn't support Geolocation
    handleNoGeolocation(false);
  }
}

function handleNoGeolocation(errorFlag) {
  if (errorFlag) {
    var content = 'Error: The Geolocation service failed.';
  } else {
    var content = 'Error: Your browser doesn\'t support geolocation.';
  }

  var options = {
    map: map,
    position: new google.maps.LatLng(60, 105),
    content: content
  };

  var infowindow = new google.maps.InfoWindow(options);
  map.setCenter(options.position);
}

google.maps.event.addDomListener(window, 'load', initialize);
[/php]

 

Untuk kode lengkap yang dipadukan dengan HTML5 dan PHP sebagai berikut:

[php]

<!DOCTYPE html>
<html>
  <head>
    <title>Geolocation</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>

    <script>
// Note: This example requires that you consent to location sharing when
// prompted by your browser. If you see a blank space instead of the map, this
// is probably because you have denied permission for location sharing.

var map;

function initialize() {
  var mapOptions = {
    zoom: 6
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);

  // Try HTML5 geolocation
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude,
                                       position.coords.longitude);

      var infowindow = new google.maps.InfoWindow({
        map: map,
        position: pos,
        content: 'Location found using HTML5.'
      });

      map.setCenter(pos);
    }, function() {
      handleNoGeolocation(true);
    });
  } else {
    // Browser doesn't support Geolocation
    handleNoGeolocation(false);
  }
}

function handleNoGeolocation(errorFlag) {
  if (errorFlag) {
    var content = 'Error: The Geolocation service failed.';
  } else {
    var content = 'Error: Your browser doesn\'t support geolocation.';
  }

  var options = {
    map: map,
    position: new google.maps.LatLng(60, 105),
    content: content
  };

  var infowindow = new google.maps.InfoWindow(options);
  map.setCenter(options.position);
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
</html>
[/php]

 

Source Code referensi by : Google Maps Documentation

Nah semoga artikel saya kali ini bermanfaat untuk Anda semua. Mau mahir PHP dengan cepat? Baca : 9 Cara Cepat Pasti Bisa & Mahir Belajar Pemrogramman PHP.

loading...



Popular Posts

Patner

Paket Wisata Murah

  1. Paket Wisata Murah
  2. Paket Wisata Domestik Murah
  3. Paket Wisata Luar Negeri Murah
  4. Paket Wisata Bandung Murah
  5. Paket Wisata Bangka Belitung Murah
  6. Paket Wisata Batam Murah
  7. Paket Wisata Bengkulu Murah
  8. Paket Wisata Bromo Murah
  9. Paket Wisata Kamboja Murah
  10. Paket Wisata China Murah
  11. Paket Wisata Cisarua Puncak Murah
  12. Paket Wisata Danau Toba Murah
  13. Paket Wisata Dieng Murah
  14. Paket Wisata Pangandaran Murah
  15. Paket Wisata Bali Murah
  16. Paket Wisata Vietnam Murah
  17. Paket Wisata Hongkong Murah
  18. Paket Wisata Jambi Murah
  19. Paket Wisata Jepang Murah
  20. Paket Wisata Karimun Jawa Murah
  21. Paket Wisata Kediri Murah
  22. Paket Wisata Kepulauan Derawan Murah
  23. Paket Wisata Korea Murah
  24. Paket Wisata Lampung Murah
  25. Paket Wisata Lombok Murah
  26. Paket Wisata Malang Murah
  27. Paket Wisata Manado Murah
  28. Paket Wisata Minangkabau Murah
  29. Paket Wisata Pekanbaru Murah
  30. Paket Wisata Raja Ampat Murah
  31. Paket Wisata Umroh Haji Murah
  32. Paket Wisata Semarang Murah
  33. Paket Wisata Singapura Murah
  34. Paket Wisata Sumatera Barat Murah
  35. Paket Wisata Sumatera Selatan Murah
  36. Paket Wisata Sumatera Uutara Murah
  37. Paket Wisata Taiwan Murah
  38. Paket Wisata Thailand Murah
  39. Paket Wisata USA Amerika Murah