处理ctrl +点击谷歌地图

Agu*_*les 4 javascript google-maps-api-3

我正在尝试让用户通过按下控制键并点击标记在地图上选择多个标记.

为此,我写了这段代码:

google.maps.event.addListener(marker, 'click', function (e) {
    // detect if is pressed ctrlKey or not to do stuff
}
Run Code Online (Sandbox Code Playgroud)

在GoogleMaps V3 文档中e,除了latLng属性之外,没有关于此对象的信息或文档.但是当我使用谷歌浏览器进行调试时,我看到这个Ra对象包含了我所需要的内容.我的问题是,Ra如果按下ctrlKey ,硬编码这个未记录的访问是安全的吗?

在此输入图像描述

dav*_*rad 9

正如评论中所要求的那样,包含哪些内容Ra很重要?我的经验是,Google地图会不断更改这些内部变量/对象名称.


但是,已经做了一个演示,通过按住ctrl并单击标记来显示如何选择多个标记:

请参阅小提琴 - > http://jsfiddle.net/FbGa5/
注意:您必须先点击地图一次激活iframe,ctrl否则可以捕获任何其他按键.

跟踪ctrl密钥:

var selecting = false,
    selectedMarkers = [];

window.onkeydown = function(e) {
  selecting = ((e.keyIdentifier == 'Control') || (e.ctrlKey == true));
}
window.onkeyup = function(e) {
  selecting = false;
}
Run Code Online (Sandbox Code Playgroud)

如果ctrl-key已关闭且单击了标记,请选择标记.如果选择了标记,它将变为蓝色,如果取消选择标记,则会变回红色:

google.maps.event.addListener(marker, 'click', function() {
   if (!selecting) return;
   var id = this.id;
   var index = selectedMarkers.indexOf(id);
   if (index>-1) {
     this.setIcon('https://maps.gstatic.com/mapfiles/ms2/micons/red-dot.png');
     selectedMarkers.splice(index, 1);
   } else {
     selectedMarkers.push(id);             
     this.setIcon('https://maps.gstatic.com/mapfiles/ms2/micons/blue-dot.png');
   }
});
Run Code Online (Sandbox Code Playgroud)

结论:Ra在标记点击事件中您不需要或任何其他参数,以使其工作.