InfoWindows가 열림 Click without Click

Question

Google지도 API를 사용하여지도에 마커를 넣습니다. 그러나 어떤 이유에서든 내 정보창은 모든 마커에 대해 기본적으로 열리기 때문에 클릭이 없을 때도 있습니다. 나는

function PoplatePoints(data) { 
var output = new google.maps.LatLng(25.4486, 78.5696); 
var mapOptions = { 
    center: output, 
    zoom: 7 
}; 
var map = new google.maps.Map(document.getElementById('map-canvas'), 
    mapOptions); 

//var contentString = []; 
// var infowindow = []; 
for (var i = data.length - 1; i >= 0; i--) { 

    var contentString = 'Hello This is me'; 

    var infowindow = new google.maps.InfoWindow(); 

    var icon_new = "/static/beyond/img/Green.png"; 

    var marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(data[i].lat, data[i].long), 
    map: map, 
    icon: icon_new 
    }); 

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

}

Answer 1

문제는 설정하는 매우 끝에 코드에 (이어야 나에게) 다른 곳에서 아래의 코드가 괜찮을 보인다 검색했는데, 이런 일이 왜 확실하지 않다 클릭 핸들러. 그것은 멋진 방식으로 클로저를 설정하려고 시도하지만 실수로 IIFE (Immediately Invoked Function Expression)를 사용합니다. "즉시 호출 된"부분을 유의하십시오. 코드는 함수 을 참조 번호 ~ addEventListener으로 전달하지 않으므로 실제로는 함수를 먼저 실행해야합니다.

여기 클로저가 필요하지만 설정하는 데 훨씬 간단한 방법이 있습니다. 나는 이것을 다음과 같이 할 것이다 :

function PopulatePoints(data) { 
    var output = new google.maps.LatLng(25.4486, 78.5696); 
    var mapOptions = { 
     center: output, 
     zoom: 7 
    }; 

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

    for(var i = 0; i < data.length; ++i) { 
     AddPoint(data[i]); 
    } 

    function addPoint(point) { 
     // TODO: This string will probably be passed in as a 
     // property of the point variable 
     var contentString = 'Hello This is me'; 

     var infowindow = new google.maps.InfoWindow(); 

     var icon_new = "/static/beyond/img/Green.png"; 

     var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(point.lat, point.long), 
      map: map, 
      icon: icon_new 
     }); 

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