Kakao 지도에서 customOverlay.setMap(null) 관련 질문입니다

[yoonbin1004]

customOverlay이용해 지도에 표시하는데 버튼을 만들어 버튼을 누를때마다
customOverlay.setMap(null) 를 이용해서 커스텀 오버레이 숨김 표시를 합니다.
문제는 하나일때는 상관없지만 커스텀 오버레이가 여러개 이면 제일 마지막에 생성된 커스텀오버레이만 customOverlay.setMap(null) 먹힙니다.

var customOverlay = new kakao.maps.CustomOverlay({
position: position,
content: content
});

이 부분을

var Ary = new Array();
for(var i = 0 ; i < custom.length ; i++)
{
var Ary2 = [position[i], content[i]]
Ary[i] = Ary2;
}

이런식으로 다차원 배열을 이용하여
일괄로 표시하고 null 처리 가능 할까요??

[lea.ju]

아래 링크를 참고해서 배열 안에서 CustomOverlay를 선언해 주세요.

배열을 이용할 때 하나의 customOverlay를 선언한 후
버튼 클릭 시 배열의 index를 안다면 setPosition, setContent를 이용하여
사용할 수 있을 것 같습니다.

닫기가 가능한 커스텀 오버레이

크흡… 위에 제 답변이… 내용적으로 부족하지는 않다고 생각되는데 ㅠㅠ 저 커스텀 오버레이들 분명히 스타일을 보아하니 예제에 있는 형태 그대로이고 문자열을 이어붙여서 content를 구성하셨을 것이라 예상되는데요, 일단 document.createElement로 만든 HTMLElement를 content로 넘겨주시는 방식으로 변경하셔야 합니다. 그리고 각각의 element가 기본적으로 제공하는 이벤트 리스너를 통해 이벤트들을 등록하셔야 합니다. 닫기 버튼을 document.createElement로 만들고 이를 closeBtn 이란 변수에 할당 받았다고 가정하면 closeBtn.onclick = function () { /* do something / }; 혹은 closeBtn.addEventListener('click', function () { / do something */ }); 이런식으로 모든 커스텀 오버레이의 content들 마다 이벤트를 …