处理Ctrl +点击谷歌地图 [英] Handling ctrl+click on Google Maps

问题描述

我尝试让用户在我的地图上选择多个标记，方法是按控制键并单击标记。

为此，我编写此代码：

  google.maps.event.addListener（marker，'click'，function（e）{
 //检测是否按下ctrlKey或不做的东西
} 
  

在GoogleMaps V3

注意：您必须点击地图上的<可以捕获kbd> ctrl 或任何其他按键。

记录 ctrl 键：

  var selecting = false，
 selectedMarkers = []; 
 
 window.onkeydown = function（e）{
选择=（（e.keyIdentifier =='Control'）||（e.ctrlKey == true））; 
} 
 window.onkeyup = function（e）{
选择= false; 
 
  

如果 ctrl 点击标记。如果标记被选中，它会变成蓝色，如果标记被取消选中，它会变回红色：

  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'）; 
} 
}）; 
  

结论：您不需要 Ra 或标记点击事件中的任何其他参数，以使其起作用。

I'm trying to make the user select multiple markers on my map by pressing control key and click on the marker.

For doing this, I write this code:

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

In the GoogleMaps V3 docs there is no info or documentation about this e object, beyond the latLng property. But when I debug with Google Chrome, I see this Ra object that contains exactly what I needed. My question is, it is safe to hardcode this undocumented Ra access to obtain if ctrlKey is pressed?

解决方案

As asked for in comment, what contains Ra that is important? My experience is, that google maps change those internal variable / object names constantly.

---

However, had made a demo to show how to select multiple markers by holding ctrl down and clicking on the markers :

See fiddle -> http://jsfiddle.net/FbGa5/
Notice : You must activate the iframe by clicking on the map once before ctrl or any other keypress can be captured.

Keep track of the ctrl key :

var selecting = false,
    selectedMarkers = [];

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

Select markers if ctrl-key is down and a marker is clicked. If a marker is selected, it turns blue, if a marker is deselected it turns back to red :

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

Conclusion : You do not need Ra or any other argument in the marker click event in order to get it to work.

这篇关于处理Ctrl +点击谷歌地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！