2011-09-28 4 views
0

웹 페이지에서 Google지도 API를 사용하고 있습니다. 정보창이있는 페이지에 여러 마커를 추가하려고합니다. 마커는 추가되었지만 정보 창에는 모두 마지막 마커에 대한 정보가 있습니다. 어떤 아이디어?Google지도 멀티 마커 정보 창이 작동하지 않습니다.

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> 

    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
     <Services> 
      <asp:ServiceReference Path="http://testserver/se1/WebServices/ShelterWebService.asmx" /> 
     </Services> 
    </asp:ScriptManager> 

       <asp:LinkButton ID="BtnHome" runat="server" onclick="BtnHome_Click">Home</asp:LinkButton> 

<div id="map_canvas"></div> 

<script type="text/javascript"> 
    var geocoder; 
    var map; 
    var addresses; 

    function GetShelters() { 
     ShelterExpress.WebServices.ShelterWebService.GetShelters('', OnGetSheltersComplete); 
    } 

    function OnGetSheltersComplete(retValue) { 
     addresses = new Array(); 

     for (x in retValue) { 
      addresses.push(retValue[x]["Address"]); 
     } 

     GenerateMap(); 
    } 

    function GenerateMap() { 
     /* Create the geocoder */ 
     geocoder = new google.maps.Geocoder(); 
     /* Some initial data for the map */ 
     mapOptions = { 
      zoom: 10 
     , center: new google.maps.LatLng(0, 0) 
     , mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 

     //var infowindow = new google.maps.InfoWindow(); 
     var marker, i; 

     if (geocoder) { 
      for (var item in addresses){ 
       geocoder.geocode({ 'address': addresses[item] }, function(results, status) { 

        if (status == google.maps.GeocoderStatus.OK) { 
         /* Position the map */ 
         map.panTo(results[0].geometry.location); 
         /* Put a marker */ 
         marker = new google.maps.Marker({ 
          map: map, 
          position: results[0].geometry.location, 
          title: addresses[item] 
         }); 

         var infowindow = new google.maps.InfoWindow({ content: addresses[item] }); 
         infowindow.open(map, marker); 

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

    $(document).ready(function() { 

     GetShelters();     
    }); 

답변

0

개체 또는 배열을 복사 한 것으로 추정됩니다. 주소에 대한 자세한 정보를 제공해야합니다. [항목]

자바 스크립트에서 문자열이나 부울과 같은 내용을 복사하면 실제 복사가되지만 객체 또는 배열은 복사됩니다. only gives a reference. NEW 정보에 대한

var foo = [1, 2, 3]; 
var bar = foo; 
bar[1] = 5; 
alert(foo[1]); 
// alerts 5 

편집 : 당신이 jQuery를로드하는 경우, JS 개체를 복제하는 빠른 방법은 (당신은 그냥 자바 스크립트의 슬라이스를 사용할 수있는 배열 $ .extend()

// Shallow copy 
var newObject = jQuery.extend({}, oldObject); 

// Deep copy 
var newObject = jQuery.extend(true, {}, oldObject); 

을 사용하는 것입니다)

retValue [x] [ "Address"]가 무엇이고로드 한 라이브러리에 따라 달라집니다.

+0

나는 op를 업데이트하고 나머지 스크립트를 추가했습니다. – Rod

+0

아니, 당신은 방금 누락 된 정보를 옮겼습니다. 이제 retValue [x] [ "Address"]가 무엇인지 알아야합니다. 그것이 당신이 [item] 주소로 "밀어 넣은"것입니다. 다시 말하지만,이 객체는 아마도 객체 또는 배열이므로 복제되지 않고 참조되지 않아야합니다. 제가 제공 한 링크를 읽으십시오. – Sinetheta

+0

도움 주셔서 감사합니다.) 오해를해서 죄송합니다. 주소는 서버 측의 일반 콜렉션입니다. – Rod

관련 문제