在googlemap上绘制多个标记，但我对所有标记都得到相同的信息窗口

Plot multiple markers on googlemap, but I'm getting the same infowindow for all markers

本文关键字：窗口信息窗信息绘制 googlemap 更新时间：2023-09-26

我有一个单独的php文件，其中我从mysql数据库检索地址并输出xml文件。然后使用ajax，我试图得到这些地址和地图在谷歌地图。多重infoWindow是我的问题。我已经挣扎了好几个小时了，请帮帮我。

下面是我的代码:

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
    <style>
    html, body {
    height: 100%;
    margin: 0;
    padding: 0;
               }
    #map       {
    height: 100%;
               }
    </style>
<script src="https://maps.googleapis.com/maps/api/js?signed_in=true">   </script> 
<script>
function loadXMLDoc(url)
   {
   var map;
   var mapOptions =        {
   zoom: 13,
   center: {lat:8.719910, lng: 77.740626}
                           };
   map = new google.maps.Map(document.getElementById('map'),
   mapOptions);
   var xmlhttp;
   var txt,x,xx,i,out1,out2,out3,out4;
   var markers=[];
   var infoWindow = new google.maps.InfoWindow ;
   if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
    }
  else
   {// code for IE6, IE5
   xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   xmlhttp.onreadystatechange=function()
   {
   if (xmlhttp.readyState==4 && xmlhttp.status==200)
   {
    x=xmlhttp.responseXML.documentElement.getElementsByTagName("details1");
    for(i=0;i<x.length;i++)
      {
    xx=x[i].getElementsByTagName("Latitude");
    out1=xx[0].firstChild.nodeValue;
    xx=x[i].getElementsByTagName("Longitude");
    out2=xx[0].firstChild.nodeValue;
    xx=x[0].getElementsByTagName("Nameoforg");
    out3=xx[0].firstChild.nodeValue;
    xx=x[0].getElementsByTagName("Phoneno");
    out4=xx[0].firstChild.nodeValue; 
    var html = '<p>Donor Location:' +'Nameoforg'+' '+out3+'Phoneno'+out4+' '+ '</p>' ;     
    markers.push(new google.maps.Marker({
    position: { lat:parseFloat(out1), lng: parseFloat(out2)},
    map: map     
                                       }));
    bindinfo(markers[i], map, infoWindow, html);
       }
    document.getElementById('txtCDInfo').innerHTML=html;
    } 
    }
    xmlhttp.open("GET",url,true);
    xmlhttp.send(); 
    }
    function bindinfo(marker, map, infoWindow, html) {
    google.maps.event.addListener(marker, 'click', function() {
    infoWindow.setContent(html);
    infoWindow.open(map, marker);
                                                            });
                                                      }
    </script>
    </head>
    <body onload="loadXMLDoc('mapxml.php')",initialize()>
    <div id="txtCDInfo"></div>
    <div id="map">
    </div>
    </body>
    </html>

每次都应该像这样初始化infoWindow:

 function bindinfo(marker, map, infoWindow, html) {
    var infoWindow = new google.maps.InfoWindow({
        content: html
    });
        google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
                                                                });
                                                          }