[GIS] How to use shift or ctrl key without openlayers 3

map-drawingmapguideol-interactionopenlayers

I want to verify if Shift or Ctrl key is pressed to make my own multiselection.

I use a digitizer to draw polygon, rectangle, etc… to make selection from geometry on server-side (with mapguide api).

My problem is when I want to make a multiselection, I need to press Shift or Ctrl key and draw my rectangle for example. After I send to the server my rectangle geometry and that I'm in multiselection because of Ctrl or shift key pressed.

But when I press shift and I want to draw, I see my pointer of drawing but on first click, my draw stop.

And when I press Ctrl and I want to draw, I see my pointer of drawing too but when I click, nothing happend.

I have disable map interactions :

me._map = new ol.Map({
interactions: ol.interaction.defaults({
  doubleClickZoom: false,
  shiftDragZoom: false,
  altShiftDragRotate: false,
  keyboard: false,
  pinchRotate: false,
  pinchZoom: false,

}),
controls: [],
layers: [layer],
target: me._options.target,
view: new ol.View(options)
});

I want to do this since I'm drawing with my digitizer: 

on(document, "keydown", function (event)
    {
      if (event.keyCode == keys.SHIFT || event.keycode == keys.CTRL)
        me._isShiftDown = true;
    });
    on(document, "keyup", function (event)
    {
      if (event.keyCode == keys.SHIFT || event.keycode == keys.CTRL)
        me._isShiftDown = false;
    });
    window.onblur = function ()
    {
      me._isShiftDown = false;
    };

Best Answer

I had a similar requirement, so I managed to solve it that way:

var shiftKeyPressed;
function initSelectOnBoxControl (){ 
selectOnBoxInt = new ol.interaction.DragBox({
  //  condition  : ol.events.condition.always,
    condition : function(e){
        console.log(e.browserEvent.shiftKey);
        shiftKeyPressed = e.browserEvent.shiftKey;
        return true;//always return true but need to set whether shift key is pressed or not
    },
    style      : new ol.style.Style({
        fill       : new ol.style.Fill({
            color      : 'rgba(255, 255, 255, 0.6)'
        }),
        stroke     : new ol.style.Stroke({
            color    : 'red',
            width    : 3
    })
  })
});  
selectOnBoxInt.on('boxend',function(e){
alert("action for selection here. Shift key is pressed:"+shiftKeyPressed);
});
Related Question