Google지도 마커 이벤트 클릭 문제

Question

function initMap() { 
    var markers = []; 

    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 10, 
     center: { lat: -33.9, lng: 151.2 }, 
     mapTypeControl: false, 
     streetViewControl: false 

    }); 

    bounds = new google.maps.LatLngBounds(null); 

    @foreach (var item in Model.legs) 
    { 
     if (item.Lat != null && item.Long != null) 
     { 
      <text> 

       var myLatLng = {lat: @item.Lat, lng: @item.Long}; 
       var marker = new google.maps.Marker({ 
        position: myLatLng, 
        map: map, 
        title: '@(item.From) - @(item.To)', 
        icon: '@(Url.Content("~/content/images/Map-Marker.png"))', 
       }); 
       marker.addListener('click', function() { 
        marker.setIcon('@(Url.Content("~/content/images/Map-Marker-Blue.png"))'); 
        alert(' @item.Id clicked'); 
       }); 
       bounds.extend(myLatLng); 
       markers.push(marker);      
      </text> 
     } 
    } 
    map.fitBounds(bounds); 
} 

google maps API에서 alert item.id가 아약스 팝업 (코드에는 표시되지 않음)을 발생시켜야합니다. 마커를 클릭하면 선택된 마커의 ID를 보여주는 경고가 올바르게 표시됩니다. 이 부분은 괜찮습니다.

마커를 클릭했을 때 마커 아이콘을 다른 아이콘으로 변경하는 코드가 추가되었지만 마지막 마커의 아이콘이 변경됩니다. 클릭 한 아이콘과 상관없이 내가 도대체 ​​뭘 잘못하고있는 겁니까?

Answer 1

당신은 마커 대신이를 사용해야합니다, 당신의 마커는 결국 때문에 범위 체인

marker.addListener('click', function() { 
       this.setIcon('@(Url.Content("~/content/images/Map-Marker-Blue.png"))'); 

}

는 희망이 도움의 마지막 마커를 가리 킵니다.