地圖事件
                編輯時間:2017-02-03

                地圖事件概述

                瀏覽器中的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);


                微信掃碼添加客服
                400-028-7262
                聯系我們
                主站蜘蛛池模板: 亚洲综合久久精品无码色欲| 国产精品亚洲色图| 国产午夜在线视频| www.5any.com| 波多野结无码高清中文| 国产伦精品一区二区三区免.费 | 青青青伊人色综合久久| 国内精品久久人妻无码不卡| 中国老师69xxxx高清hd| 日韩国产成人精品视频| 制服丝袜电影在线观看| 黑人巨大精品欧美一区二区免费| 成人在线免费网站| 亚洲1区1区3区4区产品乱码芒果| 热99re久久精品精品免费| 四虎影视永久免费观看| 国产玉足榨精视频在线观看 | 欧美日韩国产另类一区二区三区 | 久久99精品国产麻豆婷婷| a级毛片100部免费观看| 欧美黑人vs亚裔videos| 国产一区在线观看免费| 香蕉免费看一区二区三区| 成人3d黄动漫无尽视频网站| 亚洲中文字幕无码专区| 男人边吃奶边做边爱完整| 国产乱子伦精品免费无码专区| 18以下岁毛片在免费播放| 女偶像私下的y荡生活| 久久久久久久久蜜桃| 精品美女模特在线网站| 国产特级毛片AAAAAA| 中文字幕第二页| 欧美free激情野战hd| 偷天宝鉴在线观看| 色欲综合久久中文字幕网| 国产精品无码无卡在线播放| jizz中国jizz欧洲/日韩在线| 日日躁夜夜躁狠狠躁| 人妻少妇精品久久久久久| 蜜中蜜3在线观看视频|