1

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;
    };
1

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

Thanks for this answer, I have resolved my problem making a condition in my draw interaction and setting shiftKeyPressed in global variable like this :

var shiftKeyPressed = false;
    me._draw = new ol.interaction.Draw({
      condition: function (e)
      {
        shiftKeyPressed = e.browserEvent.shiftKey;
        return true;
        //always return true to use the interaction with key pressed or not
      },
      type: type,
      geometryFunction: geometryFunction,
      maxPoints: maxPoints
    });

And I send it in my callback:

me._draw.on("drawend", function (event)
    {
      me._map.removeInteraction(me._draw);
      me._draw = null;
      var geometry = event.feature.getGeometry();

      if (me._callback != null)
      {
        callback.call(me._scope || me, geometry, shiftKeyPressed);
      }
    });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.