Dasar Dasar Google Maps API

yogyakarta

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

Author: Candra Adi Putra

Candra Adi Putra adalah Alumni STMIK AKAKOM Yogyakarta. Like Candralab Studio Di Facebook.

1 thought on “Dasar Dasar Google Maps API”

Tinggalin komentar dong!