我的应用程序上有谷歌地图,我使用地图绘制折线。我想在谷歌地图上听键盘事件,以便说如果我在绘制折线时按下Esc键,它应该停止绘图(它应该重置DrawingMode)。 我试过两种方式。 1.我在其容器中添加了关键事件:
bindKeyEventsForMapButtons : function(btn){
var me = this;
btn.el.dom.onkeydown = function (e) {
if(btn.getId() == 'drawPerimeterGoogleMap'){
if(btn.pressed==true)
btn.toggle(false);
}else if(btn.getId() == 'removeAllPerimeter'){
btn.setPressed(false);
}
}
}
在这种情况下,当我点击地图时会触发事件。但是当我在地图上画画时并非如此。
通过向地图本身添加事件
google.maps.event.addListener(me.map, 'keydown', function () {
alert('in keydown');
});
这永远不会被解雇。
我不想在窗口或整个文档上听关键事件,因为我在文档中也有其他组件
有任何帮助吗?感谢
答案 0 :(得分:6)
您需要注册一个DOM事件监听器addDomListener
并在setDrawingMode(null)
上调用drawingManager
。
google.maps.event.addDomListener(document, 'keyup', function (e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code === 27) {
drawingManager.setDrawingMode(null);
}
});
以下是一个工作演示。希望这会有所帮助。
修改强>:
我意识到虽然这适用于矩形,但它似乎不适用于多边形,因为将绘图模式设置为null实际上完成了叠加。在这种情况下,除了上述内容之外,您还需要跟踪叠加层(在overlaycomplete
事件中)并在多边形上调用setMap(null)
。
var polygon;
google.maps.event.addListener(drawingManager, 'overlaycomplete', function(e) {
polygon = e.overlay;
});
google.maps.event.addDomListener(document, 'keyup', function (e) {
var code = (e.keyCode ? e.keyCode : e.which);
if (code === 27) {
drawingManager.setDrawingMode(null);
polygon.setMap(null);
}
});