내 Google지도에서 하나의 InfoWindow 만 열면됩니다. 새 InfoWindows를 열기 전에 다른 모든 InfoWindows를 닫아야합니다.
누군가이 작업을 수행하는 방법을 보여줄 수 있습니까?
답변
InfoWindow개체를 하나만 만들고 참조를 유지하고 모든 마커에 대해 재사용해야합니다. Google Maps API 문서에서 인용 :
한 번에 하나의 정보 창만 표시하려는 경우 (Google지도의 동작과 같이) 정보 창을 하나만 만들어야합니다.이 창은지도 이벤트 (예 : 사용자 클릭)시 다른 위치 또는 마커에 다시 할당 할 수 있습니다.
따라서 InfoWindow지도를 초기화 한 직후에 객체 를 만들고 click다음과 같이 마커 의 이벤트 핸들러 를 처리 할 수 있습니다. 다음과 같은 마커가 있다고 가정 해 보겠습니다 someMarker.
google.maps.event.addListener(someMarker, 'click', function() {
infowindow.setContent('Hello World');
infowindow.open(map, this);
});
그런 다음 메서드 InfoWindow를 호출하지 않고도 새 마커를 클릭하면가 자동으로 닫힙니다 close().
답변
공유 할 수 있도록 범위 밖에서 정보창을 만드세요.
다음은 간단한 예입니다.
var markers = [AnArrayOfMarkers];
var infowindow = new google.maps.InfoWindow();
for (var i = 0, marker; marker = markers[i]; i++) {
google.maps.event.addListener(marker, 'click', function(e) {
infowindow.setContent('Marker position: ' + this.getPosition());
infowindow.open(map, this);
});
}
답변
나는 똑같은 문제가 있었지만 가장 좋은 대답은 그것을 완전히 해결하지 못했습니다. 아마도 이것은 누군가를 도울 것입니다.
for(var i = 0; i < markers.length; i++){
name = markers[i].getAttribute("name");
address = markers[i].getAttribute("address");
point = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
contentString = '<div style="font-family: Lucida Grande, Arial, sans-serif;>'+'<div><b>'+ name +'</b></div>'+'<div>'+ address +'</div>';
marker = new google.maps.Marker({
map: map,
position: point,
title: name+" "+address,
buborek: contentString
});
google.maps.event.addListener(marker, 'click', function(){
infowindow.setContent(this.buborek);
infowindow.open(map,this);
});
marker.setMap(map);
}
답변
조금 늦었지만 infowindow를 전역 변수로 만들어서 하나의 infowindow 만 열었습니다.
var infowindow = new google.maps.InfoWindow({});
그런 다음 listner 내부
infowindow.close();
infowindow = new google.maps.InfoWindow({
content: '<h1>'+arrondissement+'</h1>'+ gemeentesFiltered
});
infowindow.open(map, this);
답변
글 로바를 선언 var selectedInfoWindow;하고 열린 정보 창을 유지하는 데 사용합니다.
var infoWindow = new google.maps.InfoWindow({
content: content
});
// Open the infowindow on marker click
google.maps.event.addListener(marker, "click", function() {
//Check if there some info window selected and if is opened then close it
if (selectedInfoWindow != null && selectedInfoWindow.getMap() != null) {
selectedInfoWindow.close();
//If the clicked window is the selected window, deselect it and return
if (selectedInfoWindow == infoWindow) {
selectedInfoWindow = null;
return;
}
}
//If arrive here, that mean you should open the new info window
//because is different from the selected
selectedInfoWindow = infoWindow;
selectedInfoWindow.open(map, marker);
});
답변
새 마커에서 클릭 이벤트를 처리 할 때 이전 InfoWindow 개체를 추적 하고 해당 개체 에서 close 메서드를 호출해야 합니다 .
NB 공유 정보 창 개체에 대해 close를 호출 할 필요가 없습니다. 다른 마커로 open을 호출하면 원본이 자동으로 닫힙니다. 자세한 내용은 Daniel의 답변 을 참조하십시오.
답변
기본적으로 하나에 대한 참조를 유지하는 하나의 함수 new InfoBox()=> onclick 이벤트를 위임합니다. 마커를 만드는 동안 (루프에서) 사용bindInfoBox(xhr, map, marker);
// @param(project): xhr : data for infoBox template
// @param(map): object : google.maps.map
// @param(marker): object : google.maps.marker
bindInfoBox: (function () {
var options = $.extend({}, cfg.infoBoxOptions, { pixelOffset: new google.maps.Size(-450, -30) }),
infoBox = new window.InfoBox(options);
return function (project, map, marker) {
var tpl = renderTemplate(project, cfg.infoBoxTpl); // similar to Mustache, Handlebars
google.maps.event.addListener(marker, 'click', function () {
infoBox.setContent(tpl);
infoBox.open(map, marker);
});
};
}())
var infoBox비동기 적으로 할당되고 메모리에 보관됩니다. bindInfoBox()반환 함수 를 호출 할 때마다 대신 호출됩니다. infoBoxOptions한 번만 통과하는 것도 편리합니다 !
내 예에서는 map초기화가 탭 이벤트에 의해 지연되므로에 매개 변수를 추가해야했습니다 .
