Showing posts with label Google Maps API. Show all posts
Showing posts with label Google Maps API. Show all posts

Monday, November 3, 2014

Mendapatkan Nilai Koordinat (latitude dan longitude) pada Google Maps

Google menyediakan API dimana kita bisa memakainya dalam aplikasi web yang kita bangun. Google maps API ini bisanya digunakan dalam web yang memerlukan tampilan peta untuk menunjukkan suatu lokasi. Dengan menggunakan Google Maps API ini kita bisa meletakkan /menampilkan (meng-embed) peta google maps pada web yang kita buat. Dengan menampilkan peta pada web akan membuat tampilan web menjadi lebih bagus dan interaktif untuk menunjukkan suatu lokasi.
Dalam tutorial sebelumnya yang pernah saya buat (Memasang google maps pada web ) saya sudah menjalaskan bagaimana memasang google maps pada web. Pada kesempatan kali ini saya akan membahas bagaimana cara mendapatkan koordinat (latitude dan longitud) dari sebuah lokasi pada peta Google Maps. Tentunya koordinat tersebut kita dapatkan dengan cara menggeser atau memilih lokasi pada maps interaktif dan selanjutnya kita mendapatkan nilai dari longitude dan latitude nya. Seperti pada gambar dibawah ini,

Tuesday, October 25, 2011

Cara memasang Peta Google (Google Maps API) pada web PHP

Kebetulan kemaren habis dapet proyek kecil kecilan mengenai web GIS, klient minta dibuatkan web yang ada peta nya, lalu proyek tersebut kita buat dengan memasang GoogleMaps. Cara ini dilakukan dengan cara memanfaatkan Google Maps API yang disediakan oleh google. Nah untuk tau lebih jauh mengenai Google Maps API bisa baca-baca di alamat Dokumentasi Google Maps berikut ini : Google API
Sebenarnya utnuk memasang (meng embbed) Google Maps pada sebuah web cukup mudah,tentunya server atau komputer lokal yang digunakan untuk develop harus memiliki koneksi internet tentunya. Berikut ini adalah langkah-langkah untuk memasang GoogleMaps :

1. Yang pertama kita harus memasang Script untuk mengakses Google Maps API, Script nya adalah seperti berikut ini:

< script src="http://maps.google.com/maps?file=api&v=2&key=abcdefg"    type="text/javascript"> < / script >
2.yang berikutnya, membuat code javascript untuk menampilkan peta dengan menggunakan fungsi "load". yang dimaksud disini adalah peta akan muncul pada saat halaman web tersebut di buka.

< script type="text/javascript">   
  
    function load(Lat,Lng) {
  var map = new GMap(document.getElementById("map"));
  map.addControl(new GSmallMapControl());
  map.addControl(new GMapTypeControl());
  map.centerAndZoom(new GPoint(Lat,Lng),1);  
  var point = new GPoint(Lat, Lng);
  var marker = new GMarker(point);
  map.addOverlay(marker);
    }
    
    < / script >

Copy paste code pada langkah nomor 1 dan 2 di atas sebelum tag < / head > tapi sebenarnya bisa di letakkan di manapun, ini biar rapi.
3. Sekarang untuk memanggil fungsi dari JavaScript tersebut, Agar supaya maps muncul pada saat halaman web dibuka letakkan pada tag body dengan event onload :

 
< ? PHP
$Lat = 110.379011 ;
$Lng= -7.764137;
? >

< body onload="load( < ? echo $Lat; ? >,< ? echo $Lng; ? >)" onunload="GUnload()" >

< div id="map" style="width: 500px; height: 300px" >< / div >


Berikut ini penjelasan mengenai code diatas :
1. terdapat variable PHP ( $Lat dan $Lng ), itu untuk mendefinisikan Latitude dan Longitude yaitu posisi Maps yang akan muncul nanti, variabel itu nantinya bisa dimodifikasi jika menggunakan data dari hasil query Mysql
2. pada tag < Body > kita menggunakan event onload=load() --> ini merupakan even pada tag body yang akan dijalankan pada saat web di buka.
3. div "map", pad div inilah nanti peta akan ditampilkan kita bisa mengatur lebar dan tinggi frame untuk petanya.

dari hasil code diatas hasil peta yang akan muncul :

itu tadi langkah-langkah sederhana untuk memasang Google maps pada halaman Web, untuk memperoleh ilmu yang lebih banyak silahkan mengunjungi Halaman Dokumentasi dari Google Maps API.