마커 지도에 바인딩 시점, marker.setMap(map) 콜백가능여부 문의

안녕하세요.

카카오 지도 API를 사용한 웹 시스템 개발중에 있습니다.

지도 클릭시 마커 생성후 특정 함수를 실행하고 싶습니다.

예를들어 지도위에 만들어둔 신규입력 버튼을 클릭하였을 시

지도에 클릭 이벤트를 바인딩 후

그 후 특정 지점 클릭 시 마커가 생성된 후 마커의 위치를 확인 후 confirm 창을 띄워

선택한 위치가 맞는지 확인을 하는 프로세스를 개발중에 있습니다.

var options = {
    center:  new kakao.maps.LatLng(37.474643, 126.507257)
    , level: 8
    , mapTypeId: kakao.maps.MapTypeId.ROADMAP
    , draggable: true
    , scrollwheel: true
    , disableDoubleClick: true
    , disableDoubleClickZoom: true
    , tileAnimation: false
}

let map = new kakao.maps.Map($("#map")[0], options);

$("#btnInsertNewDetailInfo").on("click", function (evt) {
    evt.stopPropagation();
    
    setMapClickEvent();
    
});

function setMapClickEvent () {
    kakao.maps.event.addListener(map, 'click', createMarkerToClickPoint);
}

var createMarkerToClickPoint = function (mouseEvent) {
    
    var latlng = mouseEvent.latLng;
    
    var imageSrc = "/resources/images/marker/marker_orange.png";
    var imageSize = new kakao.maps.Size(42, 42);
    var imageOption = {offset: new kakao.maps.Point(20, 39)};
    
    var marker = new kakao.maps.Marker({
        clickable: false
        , draggable: false
        , image: new kakao.maps.MarkerImage(imageSrc, imageSize, imageOption)
    });
    
    marker.setPosition(latlng);
    
    marker.setMap(map);
    
    confirmIsLatLonICorrect();
    
}

function confirmIsLatLonCorrect () {
    
    var isCorrect= confirm("선택한 위치에 신규 시설물 정보를 입력하시겠습니까?");
    
    if (isCorrect) {
        // todo : 마커 클릭이벤트 제거
    
    } else {
        alert("신규 시설물 정보를 입력할 위치를 다시 선택하세요");
    
        // todo : 생성 마커 삭제
    
        return;
    }
    
}

위와같은 소스를 실행시

지도 클릭을 하면 마커가 표시가 되기 전에 confirm 창이 먼저 뜨고 확인 또는 취소를 눌른 후에야 마커가 생성됩니다

이와 관련하여 마커 생성 시점이 언제인지와 혹시 setMap관련 콜백함수 같은것이 있는지 문의드립니다.

confirm 창은 브라우저의 동작을 일시정시하는 블록킹 기능을 갖고 있습니다.
confirm창을 써야한다면 setTimeout을 이용해서 시간차를 두고 confirm창을 열어주는 방법이 있습니다.
또는 모달 팝업을 이용해서 커스텀 confirm창을 만들어서 구현해주세요.

아앗… 블록킹 기능 생각을 못했었네요ㅠㅠ

감사합니다

1개의 좋아요