나는 ol.overlay를 드래그 할 수있게하려고 노력하고 있지만 그것을 할 수는 없습니다. 나는이 예제 (http://openlayers.org/en/v3.2.1/examples/drag-features.html?q=drag)를 찾았지만 ol.Features를 사용하여 완성되었다. 내가 필요로하는 것을 보여주기 위해 custom -html div-를 사용할 수 있기 때문에 내가 필요한 것은 오버레이이다. 나는 또한 내가 원하는 것을 할 수있는 매우 흥미로운 예를 발견했다. 그러나 그것은 구글지도 v3을 사용하여 완성되었으며 ol3을 위해 필요하다.
미리 감사드립니다.OpenLayers 3에서 ol.Overlay를 드래그 할 수 있습니까?
1
A
답변
0
UPDATE :이 ol.Map.prototype.forEachOverlayAtPixel
방법의 필요가 없습니다
(https://github.com/openlayers/ol3/issues/5760 참조).
DOM 오버레이 요소에 mousedown
청취자를 등록하기 만하면됩니다. Fiddle updated.
ol.Overlay
는 OL3에서 가난한 유형을하지만, 몇 가지 작업으로, 그래, 당신은 그것을 얻을 수 있습니다. ol.Feature
은 모두 강력합니다. 만약 당신이 정말로 필요하다면 ol.Overlay
나는 이것을 내놓았습니다 demo fiddle.
아이디어는 다음과 같습니다
이
pointerdown
지도 이벤트를 수신하고 클릭 한 픽셀에 오버레이이 있는지 확인;ol.Map.prototype.forEachOverlayAtPixel
- 단지 질문
비활성화
ol.interaction.DragPan
생성 -지도 패닝;pointermove
을 (를) 듣고 오버레이 위치를 설정하십시오.pointerup
을 청취하고ol.interaction.DragPan
을 복원하십시오.
1
오버레이의 div에 'mousedown'이벤트 리스너를 등록하기 만하면됩니다. 그 청취자 안에 'mousemove'및 'mouseup'이벤트를 창에 등록하십시오. 'mousemove'에서 위치를 업데이트하려면 'mousemove'이벤트를 인수로 취하는 ol.Map#getEventPixel()
메소드를 사용하십시오. 'mouseup'에서는 윈도우 리스너 등록을 취소하면됩니다.
marker_el.addEventListener('mousedown', function(evt) {
function move(evt) {
marker.setPosition(map.getEventCoordinate(evt));
}
function end(evt) {
window.removeEventListener('mousemove', move);
window.removeEventListener('mouseup', end);
}
window.addEventListener('mousemove', move);
window.addEventListener('mouseup', end);
});
작동 예제는 http://jsfiddle.net/rnzgfg89/6/을 참조하십시오.
안녕하세요, 감사합니다. 정말 도움이되었습니다.
감사합니다 :) – Alberto