안녕하세요.
카카오 지도 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관련 콜백함수 같은것이 있는지 문의드립니다.