CandraLab

IT Pro & Developer Resource

Menu Close

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
	<span id="more-1363"></span>  //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);
  };
})();
	&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    
    &lt;div id=&quot;peta&quot;&gt;&lt;/div&gt;

  &lt;/body&gt;
&lt;/html&gt;

hasil dari script diatas adalah sbb:

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