Cara Menampilkan Google Map dengan Geolocation

Cara Menampilkan Google Map dengan Geolocation (Google Map API) - Halo sobat, Brodroid kali ini coba memberikan sebuah tutorial sederhana untuk mengatasi mengenai Google Map yakni Menampilkan Google Map dengan Geolocation. Nah mungkin sudah banyak yang mengetahui cara tersebut, tapi Brodroid coba ulas saja sesuai yang dipahami agar Anda bisa mengetahui. Langsung saja saya jelaskan dibawah ini.

Cara Menampilkan Google Map dengan Geolocation

Buka Aplikasi PHP Editor
Pertama, silahkan buka aplikasi php editor sobat, kalau saya disini menggunakan sublime text untuk mengetik kode php dan kode lainnya. Jika sudah, buat sebuah file php baru dan inputkan kode dibawah ini :

<html>
<head>
<script type="text/javascript">
 var map = null;
    var geocoder = null;

    function initialize() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas"));
  map.setCenter(new GLatLng(-25.274398,133.775136), 1);
        map.setUIToDefault();
        geocoder = new GClientGeocoder();
      }
    }

    function showAddress(address) {
      if (geocoder) {
        geocoder.getLatLng(
          address,
          function(point) {
            if (!point) {
              alert(address + " not found");
            } else {
              map.setCenter(point, 15);
              var marker = new GMarker(point, {draggable: true});
              map.addOverlay(marker);
              GEvent.addListener(marker, "dragend", function() {
                marker.openInfoWindowHtml(marker.getLatLng().toUrlValue(6));
              });
              GEvent.addListener(marker, "click", function() {
                marker.openInfoWindowHtml(marker.getLatLng().toUrlValue(6));
              });
       GEvent.trigger(marker, "click");
            }
          }
        );
      }
    }
  </script>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxSPW5CJgpdgO_s4yyMovOaVh_KvvhSfpvagV18eOyDWu7VytS6Bi1CWxw" type="text/javascript"></script>
<title></title>
</head>
<body onload="initialize()" onunload="GUnload()">
<form name="form1" action="#" onsubmit="showAddress(this.address.value); return false">
 <input type="text" style="width:450px;" name="address" id="address" value="">
    <input type="submit" value="Tampilkan" />
</form>
<div id="map_canvas" style="width: 780px; border:2px solid #999; height: 650px;"></div>
</body>
</html>

kode diatas adalah bisa dibilang kode utama, karena kode tersebut merupakan kode API dari google agar bisa menampilkan map. Cara diatas memang mudah tapi memerlukan ketelitian, untuk menampilkan google map dengan php yang perlu diperhatikan adalah kode API dari map googlenya saja.

Demikianlah informasi tentang Cara Menampilkan Google Map dengan Geolocation yang bisa saya berikan, jika sobat ingin mendapatkan update artikel dari Brodroid bisa mendapatkannya dengan subscribe melalui email.


Blog, Updated at: Januari 04, 2017

0 komentar:

Posting Komentar