Показать маркер InfoWindow содержит данные из базы данных

Question

У меня есть маркер, который помещается в каждую позицию из lat lng из базы данных, теперь я хочу показать в InfoWindow маркера, когда он щелкнут, показывают каждую строку данных из своего собственного маркера, у которого есть информация, основанная на lat lng из базы данных. Это мой код:

//menampilkan INFOWINDOW MARKER A 

     var isi = 
     "<b>Jumlah Kejadian</b> = 10 <br> <b>Kendaraan yang terlibat</b> = 10" 
     ; 

     var infowindow = new google.maps.InfoWindow({ 
      content: isi 
     }); 

     google.maps.event.addListener(homeMarker, 'click', function() { 
      infowindow.open(map,homeMarker); 
     }); 

//menampilkan INFOWINDOW MARKER B 
     var isi2 = 
     "<b>Jumlah Kejadian</b> = 1 <br> <b>Kendaraan yang terlibat</b> = 2" 
     // '<IMG BORDER="1" ALIGN="center" SRC="rambulucu.jpg">' 

     var infowindow2 = new google.maps.InfoWindow({ 
      content: isi2 
     }); 

     google.maps.event.addListener(homeMarker2, 'click', function() { 
      infowindow2.open(map,homeMarker2); 
     });  
    } 
}); 

Этот маркер содержит только информацию из моей собственной информации, а не из базы данных. Это моя база данных:

Я хочу, чтобы показать, как «Нама, Jumlah kejadian и т.д.», чтобы показать на маркер, который щелкнул содержать только свои собственные данные

Answer 1

<script>  
function initialize() { 

          // you can pass your php variable to javascript variable(locations) as an array. 
          var locations = [ 
          ['Lorem Ipsum Dolor sit amet 1', 1.1031994976981054,104.07207012176514, 3], 
          ['Lorem Ipsum Dolor sit amet 2', 1.1041994976981054,104.07307012176514, 2], 
          ['Lorem Ipsum Dolor sit amet 3', 1.1021994976981054,104.07407012176514, 1] 
               ]; 

           var myLatlng = new google.maps.LatLng(locations[0][1], locations[0][2]); 
           var mapOptions = { 
            zoom: 15, 
            center: myLatlng 
           }; 



           var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
           var infowindow = new google.maps.InfoWindow(); 

           var marker, i; 
           // you can use looping to show multiple marker. 
            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 
             }); 

             google.maps.event.addListener(marker, 'click', (function(marker, i) { 
             return function() { 
              infowindow.setContent(locations[i][0]); 
              infowindow.open(map, marker); 
             } 
             })(marker, i)); 
            } 



           google.maps.event.addListener(marker, 'click', function() { 
            infowindow.open(map, marker); 
           }); 

           google.maps.event.addListener(marker, 'dragend', function (e) { 
            document.getElementById("Latitude").value = e.latLng.lat(); 
            document.getElementById("Longitude").value = e.latLng.lng(); 
           }); 
         } 

         google.maps.event.addDomListener(window, 'load', initialize); 
</script> 

<style> 
#map-canvas{ 
    width: 500px; 
    border: 1px solid red; 
    height: 500px; 
} 
</style> 

<div id="map-canvas"></div>