마커가 내지도에 나타나지 않습니다.

Question

데이터베이스의 이벤트에 따라 마커를 추가하려고합니다. 동일한 위치에서 이벤트가 발생하는 경우 새 이벤트에 대한 정보 버블에 탭을 추가합니다. 마커 (및 내 정보 거품)가 왜 내지도에 나타나지 않는지 파악할 수 없습니다.

여기 내 코드입니다 :

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDpQfirqx48owNbdu6ZF01pTr3Lt-tjYQI&sensor=false"></script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/src/infobubble.js"></script> 
<script type="text/javascript"> 

var location_icon = new google.maps.MarkerImage('../images/FAFSA_Logo_icon.png'); 
var map; 
var markersArray= []; 
var infobubblesArray = []; 
    function load() { 

    map = new google.maps.Map(document.getElementById("map"), { 
     center: new google.maps.LatLng(33.961586, -106.008728), 
     zoom: 6, 
     mapTypeId: 'roadmap' 
    }); 



    downloadUrl("../site_parts/mapmysql.php", function(data) { 
    var xml = data.responseXML; 
    var markers = xml.documentElement.getElementsByTagName("marker"); 
    for (var i = 0; i < markers.length; i++) { 
     var name = markers[i].getAttribute("event_name"); 
     var address = markers[i].getAttribute("venue_address"); 
     var city = markers[i].getAttribute("venue_city"); 
     var state = markers[i].getAttribute("venue_state"); 
     var zip = markers[i].getAttribute("venue_zip"); 
     var website = markers[i].getAttribute("venue_website"); 

     var date = markers[i].getAttribute("event_date"); 
     var start_time = markers[i].getAttribute("event_start_time"); 
     var end_time = markers[i].getAttribute("event_end_time"); 
     var room = markers[i].getAttribute("event_room"); 
     var cord = markers[i].getAttribute("ec_fname") + " " + markers[i].getAttribute("ec_lname"); 
     var cord_email = markers[i].getAttribute("ec_email"); 
     var cord_pnumber = markers[i].getAttribute("ec_pnumber"); 
     var point = new google.maps.LatLng(
      parseFloat(markers[i].getAttribute("venue_lat")), 
      parseFloat(markers[i].getAttribute("venue_lng"))); 
     var html = "<b>" + name + "</b> <br/>" + address +", "+ city +", "+ state +", "+ zip + "<br/>" +"<b>Date </b> "+ date +"<br/>" +"<b>Time </b> "+ start_time + " - "+ end_time +"<br/>" + "<b>Room </b>" + room + "<br/>"+ "<b> Cordinator </b>" + cord + " " + "<a href='mailto:" + cord_email + "?Subject=FAFSA%20FFA%20Event'>" + cord_email + "</a> " + cord_pnumber; 
     var icon = location_icon; 

      for (var x = 0; x < markersArray.length; x++){ 
       if (markersArray[x].getPosition() == point){ 
        infobubblesArray[x].addTab(date, html); 
        break; 
       } 
       if (x < (markersArray.length -1)){continue} else{ 
        var newM = x+1; 
        markersArray[newM] = new google.maps.Marker({map: map, position: point, icon: icon}); 
        infobubbleArray[newM] = new InfoBubble({maxWidth: 400, borderWidth: 2}); 
        bindinfoBubble(markersArray[newM], map, infobubblesArray[newM]) 
        infobubblesArray[newM].addTab(date, html); 
        } 
      } 
     } 
    }); 
    } 

function bindinfoBubble(marker, map, infoBubble) { 
    google.maps.event.addListener(marker, 'click', function() { 

    infoBubble.open(map, marker); 


    }); 
} 

function downloadUrl(url,callback) { 
var request = window.ActiveXObject ? 
    new ActiveXObject('Microsoft.XMLHTTP') : 
    new XMLHttpRequest; 

request.onreadystatechange = function() { 
    if (request.readyState == 4) { 
    request.onreadystatechange = doNothing; 
    callback(request, request.status); 
    } 
}; 

request.open('GET', url, true); 
request.send(null); 
} 

function doNothing() {} 

</script> 

XML

<markers> 
<marker event_name="Atrisco Heritage Academy" venue_address="10800 Dennis Chavez    Boulevard" venue_city="Albuquerque" venue_state="New Mexico" venue_zip="87121"   venue_website="http://ahahighschool.com" venue_lat="35.022449" venue_lng="-106.748777"    event_date="2013-01-17" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
<marker event_name="Bernalillo High School" venue_address="250 Isidro Sanchez Rd" venue_city="Bernalillo" venue_state="New Mexico" venue_zip="87004" venue_website="http://www.bernalillo.bps.k12.nm.us/education/school/school.php?sectionid=3" venue_lat="35.321560" venue_lng="-106.541828" event_date="2013-01-22" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
<marker event_name="Bernalillo High School" venue_address="250 Isidro Sanchez Rd" venue_city="Bernalillo" venue_state="New Mexico" venue_zip="87004" venue_website="http://www.bernalillo.bps.k12.nm.us/education/school/school.php?sectionid=3" venue_lat="35.321560" venue_lng="-106.541828" event_date="2013-01-23" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
<marker event_name="Cibola High School" venue_address="1510 Ellison Drive" venue_city="Albuquerque" venue_state="New Mexico" venue_zip="87114" venue_website="http://www.cibolacougars.com" venue_lat="35.205190" venue_lng="-106.663214" event_date="2013-01-23" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
<marker event_name="Rio Rancho High School" venue_address="301 Loma Colorado N.E." venue_city="Rio Rancho" venue_state="New Mexico" venue_zip="87124" venue_website="http://rioranchohigh.rrps.net/" venue_lat="35.272536" venue_lng="-106.678116" event_date="2013-01-30" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
<marker event_name="Farmington high School" venue_address="2200 Sunset Ave." venue_city="Farmington" venue_state="New Mexico" venue_zip="87401" venue_website="http://fhs.fms.k12.nm.us/" venue_lat="36.749957" venue_lng="-108.204563" event_date="2013-02-04" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
<marker event_name="Cimarron High School" venue_address="165 North Collison Avenue" venue_city="Cimarron" venue_state="NM" venue_zip="87714" venue_website="http://www.chsrams.org/" venue_lat="36.512275" venue_lng="-104.920166" event_date="2013-02-04" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
<marker event_name="West Mesa High School" venue_address="6701 Fortuna Road NW" venue_city="Albuquerque" venue_state="New Mexico" venue_zip="87121" venue_website="http://www.westmesamustangs.com" venue_lat="35.095882" venue_lng="-106.716171" event_date="2013-02-05" event_start_time="0" event_end_time="0" event_room="TBD" ec_fname="TBD" ec_lname="" ec_email="" ec_pnumber=""/> 
</markers> 

Answer 1

내가 여기 (현재 탭 위의 행에서 시작 탭 이외의) 끝입니다 작동하는 것 같군 해결책을 발견 : 오타도 있습니다, infobubbleArray는 infobubblesArray

고정 코드해야 루프를 확인하십시오 :

var x = 0; 

while (x < (markersArray.length)){ 
    if (markersArray[x].getPosition().toString() == point.toString()){ 
    infobubblesArray[x].addTab(date, html); 
    continue xmlLoop; /*to the outside loop for the xml sheet readthrough*/ 
    }x++; 
} 

var newM = markersArray.length; 
markersArray[newM] = new google.maps.Marker({map: map, position: point, icon: icon}); 
infobubblesArray[newM] = new InfoBubble({maxWidth: 500, minHight: 600, borderRadius: 0}); 
bindinfoBubble(markersArray[newM], map, infobubblesArray[newM]); 
infobubblesArray[newM].addTab(date, html); 

Answer 2

이, 다른 문제가있는이 for (var x = 0; x < markersArray.length; x++)

당신이 루프 내부의 마커를 만들 무엇보다도, 하지만 처음에는 markersArray가 비어 있습니다.이 루프는 실행되지 않습니다.

downloadUrl("../site_parts/mapmysql.php", function(data) { 

    var xml = data.responseXML; 
    var markers = xml.documentElement.getElementsByTagName("marker"); 
    outer: for (var i = 0; i < markers.length; i++) { 

      /* creation of the variables may stay here as it is */ 

      for (var x = 0; x < markersArray.length; x++){ 
       if (markersArray[x].getPosition().toString() == point.toString()){ 
        infobubblesArray[x].addTab(date, html);       
        continue outer; 
       }} 

       var newM = markersArray.length; 
        markersArray[newM] = new google.maps.Marker({map: map, position: point}); 
        infobubblesArray[newM] = new InfoBubble({maxWidth: 400, borderWidth: 2}); 
        bindinfoBubble(markersArray[newM], map, infobubblesArray[newM]) 
        infobubblesArray[newM].addTab(date, html); 
     } 
    });