처음에 지도는 display:none 처리 되어 있으며 커스텀 오버레이 setMap으로 지도에 이미지 마커를 찍고
이벤트가 발생하면 지도가 보여지며 위치가 안맞아 relayout(), setCenter(), setLevel()로 이미지와 마커가 보이도록 했습니다.
그런데 relayout() 해서 지도가 보여지는 영역 외에 찍힌 이미지마커를 변경하려고 하니 커스텀 오버레이 content 부분이 생성 되지 않아 변경한 content가 들어가지 않고 처음 setMap 할때 넣었던 content가 보입니다.
relayout() 후에 지도를 축소해서 이미지 마커가 보이게 한 후에 이벤트 발생시키면 변경한 content가 들어갑니다.
꼭 해당 content 가 보여지는 지도 영역에만 있어야 변경이 되나요?
display:none 상태에서 지도 마커 생성
var customOverlay = new daum.maps.CustomOverlay({
position: position,
content: normalImage,
xAnchor: 0.6,
yAnchor: 1.0
});
// 커스텀 오버레이 지도에 표시
customOverlay.setMap(map);
이벤트 발생 시 relayout 후 이미지 마커 변경
setTimeout(function() {
map.relayout()
map.setCenter(new daum.maps.LatLng(lat, lon))
//map.setLevel(4)
}, 100);
var idx = $(this).data(“list”);
$(’#customImg’+idx).attr(“src”,"${ctx}/resources/images/map/over_"+idx+".png");