Drawing manager 에서 put으로 등록한 객체 이벤트

카카오맵 API (지도/로컬)
1

manager = new kakao.maps.drawing.DrawingManager({
map: m_oMap,
drawingMode: [kakao.maps.drawing.OverlayType.POLYLINE],
polylineOptions: {
draggable: false,
removable: false,
editable: true,
strokeWeight: 5,
strokeColor: ‘#39f’,
hintStrokeStyle: ‘dash’,
hintStrokeOpacity: 0.5
},
});

        manager.cancel();
        manager.put(kakao.maps.drawing.OverlayType.POLYLINE, polyline.getPath());
        
        manager.addListener('drawstart', function(data) {
          console.log('drawstart', data);
        });

위처럼 put을 사용해서 만든 라인에 이벤트를 추가했지만 작동하지 않는것 같습니다…

manager.getOverlays()[‘polyline’].forEach(function(val) {
kakao.maps.event.addListener(val, ‘click’, function(mouseEvent){
console.log(‘listener is added’);
});
});

이런식으로 맵에 클릭 이벤트를 추가하는경우에는 작동하는거 같은데 이런경우에는 드래그 이벤트를 가져올 수가 없는것 같습니다.

put을 이용해서 추가한 폴리라인의 드래그 스타트, 엔드 이벤트를 가져올 수 있는 방법이 있는지 문의 드립니다.

2

drag 관련한 이벤트는 제공하지 않습니다.

지금 사용하신 이벤트 타입은 drawend 로써,
사용자가 오버레이 그리기를 끝마쳤을 때 발생하는 이벤트이지 drag와 관련된 이벤트는 아닙니다.

state_changed 이벤트를 사용할 수도 있지만 여러 케이스에서 발생하는 이벤트이므로 특정행동을 할 때 잡아내기 힘들며
put 이벤트로 객체를 잡아내어 이벤트는 직접 걸어서 확인하는 것이 최선입니다.

대략적인 방식은 아래와 같습니다.

var manager = new kakao.maps.drawing.DrawingManager(options);
manager.addListener('put', function(event) {
    var readyToDrag = false;
    kakao.maps.event.addListener(event.target, 'mousedown', function() {
        readyToDrag = true;
    });
    kakao.maps.event.addListener(event.target, 'mouseup', function() {
        readyToDrag = false;
    });
    kakao.maps.event.addListener(event.target, 'mousemove', function() {
        if (readyToDrag) { 
            console.log('drag start');
            readyToDrag = false;
        }
    });
});
manager.put(kakao.maps.drawing.OverlayType.POLYLINE, polyline.getPath());
1개의 좋아요