이벤트 해제하는 방법

지도/로컬 API
#1

지도/로컬 API에 대한 문의게시판입니다.

안녕하세요.

거리측정하는 sample을 참고해서 거리측정 기능을 넣었습니다.
제이쿼리를 이용해 클릭 이벤트를 넣어,

$(’#start’).on(‘click’, function(){…});

button id=‘start’ 을 누르면 아래의 거리측정 이벤트가 시작될 수 있도록 해놨습니다.

여기서, button id='stop’을 클릭하면 거리측정 이벤트가 작동안하게 이벤트 등록을 해제하려하는데요… (맵을 클릭해도 거리측정에 사용되는 선과 점이 표시 안되도록…)
조언을 구해도 될런지요?..

감사합니다.

 daum.maps.event.addListener(map, 'click', function(mouseEvent) {

            // 마우스로 클릭한 위치입니다
            var clickPosition = mouseEvent.latLng;

            // 지도 클릭이벤트가 발생했는데 선을 그리고있는 상태가 아니면
            if (!drawingFlag) {

                // 상태를 true로, 선이 그리고있는 상태로 변경합니다
                drawingFlag = true;

                // 지도 위에 선이 표시되고 있다면 지도에서 제거합니다
                deleteClickLine();

                // 지도 위에 커스텀오버레이가 표시되고 있다면 지도에서 제거합니다
                deleteDistnce();

                // 지도 위에 선을 그리기 위해 클릭한 지점과 해당 지점의 거리정보가 표시되고 있다면 지도에서 제거합니다
                deleteCircleDot();

                // 클릭한 위치를 기준으로 선을 생성하고 지도위에 표시합니다
                clickLine = new daum.maps.Polyline({
                    map: courseMap, // 선을 표시할 지도입니다
                    path: [clickPosition], // 선을 구성하는 좌표 배열입니다 클릭한 위치를 넣어줍니다
                    strokeWeight: 2, // 선의 두께입니다
                    strokeColor: '#000', // 선의 색깔입니다
                    strokeOpacity: 1, // 선의 불투명도입니다 0에서 1 사이값이며 0에 가까울수록 투명합니다
                    strokeStyle: 'solid' // 선의 스타일입니다
                });

                // 선이 그려지고 있을 때 마우스 움직임에 따라 선이 그려질 위치를 표시할 선을 생성합니다
                moveLine = new daum.maps.Polyline({
                    strokeWeight: 2, // 선의 두께입니다
                    strokeColor: '#000', // 선의 색깔입니다
                    strokeOpacity: 0.5, // 선의 불투명도입니다 0에서 1 사이값이며 0에 가까울수록 투명합니다
                    strokeStyle: 'solid' // 선의 스타일입니다
                });

                // 클릭한 지점에 대한 정보를 지도에 표시합니다
                displayCircleDot(clickPosition, 0);


            }
#2

아. 해결되었습니다. remove 리스너가 있군요.

2개의 좋아요
#4

@asdvzqff1

https://apis.map.kakao.com/web/documentation/#event_removeListener

여길 참고해 보세요.
넘어가는 인자가 이렇게 3개인데
target EventTarget : 이벤트를 지원하는 다음 지도 API 객체
type String : 이벤트 이름
handler Function : 이벤트를 처리하던 함수

이중에 handler의 경우 named function이여야 합니다.
즉, addListener에 핸들러 등록할때 익명함수나 람다함수와 같이 입력하시면, 특정 이벤트 핸들러만 삭제가 안될거에요.

var handler = function(){}
kakao.maps.event.addListener(map, 'click', handler);
kakao.maps.event.removeListener(map, 'click', handler);

요렇게 하심 됩니다.

#8

클릭이벤트와 마찬가지로 rightclick, move 이벤트 핸들러도 생성해주세요.
그리고 해당 게시글은 다른 작성자의 게시글입니다.
추가 질문사항이 있다면 아래 질문주신 링크로 작성 부탁드립니다.