事件


地圖事件概述

瀏覽器中的JavaScript是“事件驅動的”，這表示JavaScript透過產生事件來回應交互，並期望程式能夠「監聽」感興趣的活動。例如，在瀏覽器中，使用者的滑鼠和鍵盤互動可以建立在DOM內傳播的事件。對某些事件感興趣的程式會為這些事件註冊JavaScript事件監聽器，並在接收這些事件時執行程式碼。

百度地圖API擁有一個自己的事件模型，程式設計師可監聽地圖API物件的自訂事件，使用方法和DOM事件類似。但請注意，地圖API事件是獨立的，與標準DOM事件不同。

事件監聽

百度地圖API中的大部分物件都含有addEventListener方法，您可以透過此方法監聽物件事件。例如，BMap.Map包含click、dblclick等事件。在特定環境下這些事件會被觸發，同時監聽函數會得到對應的事件參數e，例如當使用者點擊地圖時，e參數會包含滑鼠所對應的地理位置point。

有關地圖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 Level 2 Events），監聽函數會得到一個事件物件e，在e中可以取得有關該事件的訊息。同時在監聽函數中this會指向觸發該事件的DOM元素。百度地圖API的事件模型與此類似，在事件監聽函數中傳遞事件物件e，每個e參數至少包含事件類型（type）和觸發該事件的物件（target）。 API也保證函數內的this指向觸發（同時也是綁定）事件的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);    
});

或透過this得到地圖縮放後的層級。 

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);