Menampilkan Banyak Marker di Google Maps dari Database

Kali ini saya akan sharing cara menampilkan banyak marker di google. Pada dasarnya sama seperti menampilkan satu marker untuk lokasi yang di tunjukan, namun jika anda membutuhkan lebih dari satu marker di google Map maka Anda perlu membuat perulangan dimana diambil dari databases.

1. Pertama Agan bikin script PHP yang menyimpan data seperti ini di bawah ini. Pasti Agan udah pada jago.

$datageolocation=”[‘<h5>Jogja</h5>’, -7.688920, 110.348755],
[‘<h5>Sleman</h5>’, -7.874818, 110.325536],
[‘<h5>Gunungkidul</h5>’, -7.826680, 110.164085]”;

2. Kemudian <script src=”http://maps.google.com/maps/api/js?sensor=false”></script>

kalau gak bisa silahkan daftaar untuk code api dari google maps. Senjutnya script javascript untuk menmpilkan multi marker google Maps.

<script>
        function initialize() {
        var locations = [<?php echo $datageolocation;?>];
        var infowindow = new google.maps.InfoWindow();
    
        var options = {
          zoom: 8, 
          center: new google.maps.LatLng(-7.795580, 110.369490),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
       // Pembuatan petanya
        var map = new google.maps.Map(document.getElementById('map_canvas'), options);
    var marker, i;
    // proses penambahan marker lainnya di jogja
    for (i = 0; i < locations.length; i++) {  
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map,
         
      });
      // Menampilkan informasi lokasi    
      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
        }
      })(marker, i));
    }
  };
</script>

Oke itu tadi cara menampilkan multi marker di google maps dari databases.
About Mr.Gng 247 Articles
Si Anak dari Orang Tua tersayang ingin berbagi ilmu dengan harapan bermanfaat bagi orang lain. Situs SeputarTI.Com ini sebagai salah satu media berbagi saya, khususnya dibidang TI. Salam Kenal dari saya... :-)

2 Comments

Leave a Reply

Your email address will not be published.


*