이벤트

지도 이벤트 개요

브라우저의 JavaScript는 "이벤트 중심"입니다. 즉, JavaScript는 이벤트를 생성하여 상호 작용에 응답하고 프로그램이 다음 활동을 "수신"할 것으로 기대합니다. 관심 . 예를 들어, 브라우저에서 사용자의 마우스 및 키보드 상호 작용은 DOM 내에서 전파되는 이벤트를 생성할 수 있습니다. 특정 이벤트에 관심이 있는 프로그램은 해당 이벤트에 대한 JavaScript 이벤트 리스너를 등록하고 해당 이벤트를 수신하면 코드를 실행합니다.

Baidu Map API에는 자체 이벤트 모델이 있습니다. 프로그래머는 지도 API 개체의 사용자 정의 이벤트를 수신할 수 있습니다. 사용 방법은 DOM 이벤트와 유사합니다. 그러나 Map API 이벤트는 독립적이며 표준 DOM 이벤트와 다릅니다.

이벤트 청취

Baidu Map API의 대부분의 개체에는 개체 이벤트를 수신할 수 있는 addEventListener 메서드가 포함되어 있습니다. 예를 들어 BMap.Map에는 click, dblclick 및 기타 이벤트가 포함되어 있습니다. 이러한 이벤트는 특정 상황에서 트리거되며 청취 기능은 해당 이벤트 매개변수 e를 얻습니다. 예를 들어 사용자가 지도를 클릭하면 e 매개변수에는 마우스에 해당하는 지리적 위치 지점이 포함됩니다.

Map API 객체에 대한 이벤트는 전체 API 참조 문서를 참조하세요.

addEventListener 메소드에는 청취할 이벤트 이름과 이벤트가 트리거될 때 호출될 함수라는 두 가지 매개변수가 있습니다. 아래 예에서는 사용자가 지도를 클릭할 때마다 경고 상자가 나타납니다.

var map = new BMap.Map("container");    
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);    
map.addEventListener("click", function(){    
 alert("您点击了地图。");    
});

이벤트를 청취하여 이벤트가 트리거된 후 상태를 캡처할 수도 있습니다. 다음 예시에서는 사용자가 지도를 드래그한 후 지도 중심의 위도 및 경도 정보를 보여줍니다.

var map = new BMap.Map("container");    
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);    
map.addEventListener("dragend", function(){    
 var center = map.getCenter();    
 alert("地图中心点变更为：" + center.lng + ", " + center.lat);    
});

이벤트 매개변수 및 this

표준 DOM 이벤트 모델(DOM 레벨 2 이벤트)에서 청취 함수는 이벤트에 대한 정보를 얻을 수 있는 이벤트 객체 e를 얻습니다. 동시에 리스닝 함수에서는 이벤트를 트리거한 DOM 요소를 가리킵니다. Baidu Map API의 이벤트 모델은 이벤트 객체 e가 이벤트 수신 함수에 전달되는 것과 유사합니다. 각 e 매개변수에는 최소한 이벤트 유형(type)과 이벤트를 트리거한 객체(target)가 포함됩니다. 또한 API는 함수 내에서 이벤트를 트리거한(및 바인딩된) API 개체를 가리키는지 확인합니다.

예를 들어 매개변수 e를 통해 클릭의 위도 및 경도 좌표를 가져옵니다.

var map = new BMap.Map("container");    
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);    
map.addEventListener("click", function(e){    
 alert(e.point.lng + ", " + e.point.lat);    
});

또는 이것을 통해 지도의 확대된 수준을 얻을 수 있습니다.

var map = new BMap.Map("container");    
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);    
map.addEventListener("zoomend", function(){    
 alert("地图缩放至：" + this.getZoom() + "级");    
});

이벤트 듣기 제거

더 이상 이벤트 듣기를 원하지 않으면 이벤트 듣기를 제거할 수 있습니다. 각 API 객체는 이벤트 수신 기능을 제거하기 위해 RemoveEventListener를 제공합니다.

아래 예에서는 사용자가 지도를 처음 클릭하면 이벤트 청취 기능이 트리거됩니다. 이벤트 청취 기능은 함수 내에서 제거되므로 후속 클릭에서는 청취 기능이 트리거되지 않습니다.

var map = new BMap.Map("container");    
map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);    
function showInfo(e){    
 alert(e.point.lng + ", " + e.point.lat);    
 map.removeEventListener("click", showInfo);    
}    
map.addEventListener("click", showInfo);