Posted in

Dasar Dasar Google Maps API

Tutorial singkat ini akan menjelaskan script dasar dari Google maps. Anda cukup menggunakan sembarang editor dan save filenya dengan nama  map1.html dan buka di browser.

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Latihan Google  map</title>
  <style type='text/css'>
  #peta {
  width: 50%;
  height: 400px;

} </style>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
    <script type="text/javascript">
	(function() {
  window.onload = function() {

    //Parameter Google maps
    var options = {
      zoom: 12, //level zoom, isi antara 1-22
	  //posisi tengah peta
      center: new google.maps.LatLng(-7.8008, 110.380643),
	  //mapTypeId bisa diganti dengan 
	  // HYBRID,TERRAIN,ROADMAP,SATELLITE
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    // Buat peta di 
    var map = new google.maps.Map(document.getElementById('peta'), options);
  };
})();
	</script>
  </head>
  <body>
    
    <div id="peta"></div>

  </body>
</html>

hasil dari script diatas adalah sbb:

Latihan
Untuk latihan, silahkan anda ganti type peta, level Zooming dan titik tengah peta

Share Artikel ini:

Candra Adi Putra S.Kom, M.Kom adalah Alumni S1 Teknik Informatika dari Universitas Teknologi Digital Indonesia Yogyakarta (Dulu bernama STMIK AKAKOM)
dan Alumni S2 Teknik Informatika dari UPI YPTK Padang

hubungi saya di candraadiputra (at) gmail (dot) com

One thought on “Dasar Dasar Google Maps API

Leave a Reply to Usman Cancel reply

Your email address will not be published. Required fields are marked *