google map事件监听
事件类型
google地图定义了大量的事件来完成复杂的交互功能。每个事件都在指定的环境下发生,并且可以传递标识环境的参数。例如,当用户在地图对象中移动鼠标时,会触发 mousemove 事件,并且该事件会传递鼠标所在地理位置的 GLatLng。
google map常用的事件有
click、dblclick 鼠标点击事件
movestart、move、moveend 地图移动事件
dragstart、drag、dragend 鼠标拖拽地图事件
zoomstart、zoomend 地图缩放事件
maptypechanged 地图类型改变事件
事件监听
请使用静态方法 GEvent.addListener()。该方法有三个参数,一个对象,一个待监听事件以及一个在指定事件发生时调用的函数。
1 var map = new GMap2(document.getElementById("map"));
2 map.setCenter(new GLatLng(37.4419, -122.1419), 13);
3 GEvent.addListener(map, "click", function() { alert("You clicked the map."); });
2 map.setCenter(new GLatLng(37.4419, -122.1419), 13);
3 GEvent.addListener(map, "click", function() { alert("You clicked the map."); });
移除事件监听的方法
在使用addListener添加的自定义事件注册事件处理程序,返回一个可用于最终注销处理程序的句柄。在使用removeListener方法移除此句柄。
1 var clickHandler = google.maps.Event.addListener(map, 'click', function(){
2 alert('click');
3 google.maps.Event.removeListener(clickHandler);
4 });
2 alert('click');
3 google.maps.Event.removeListener(clickHandler);
4 });
事件处理函数的参数
google map会未事件绑定函数传递必要的参数。例如,当用户在地图对象中移动鼠标时,会触发 mousemove
事件,并且该事件会传递鼠标所在地理位置的 GLatLng
。click事件中为事件传递点击的地图上显示自定义的叠加层对象overlay, 和地理位置坐标latlng。
1 GEvent.addListener(map,"click", function(overlay, latlng) {
2 if (latlng) {
3 var myHtml = "GPoint 为: " + map.fromLatLngToDivPixel(latlng) + ",
4 缩放级别:" + map.getZoom();
5 map.openInfoWindow(latlng, myHtml);
6 }
7 });
8
2 if (latlng) {
3 var myHtml = "GPoint 为: " + map.fromLatLngToDivPixel(latlng) + ",
4 缩放级别:" + map.getZoom();
5 map.openInfoWindow(latlng, myHtml);
6 }
7 });
8