openlayers interaction only on left mouse

Question

Using openlayers (latest - 4), I have a drawing interaction that draws a circle -

let drawCircle = new ol.interaction.Draw({source: source, type: "Circle"});
map.addInteraction(drawCircle);

Both left mouse and right mouse click have the same behavior with this interaction- they start and stop the drawing of the circle.

I also have a context menu, so I do not want the right click to do anything with the interaction, just the left click.

How do I make this happen?

Answer 1

You can use condition option for ol.interaction.Draw.
when condition meets, drawing will be started.

In your case, drawing should be start with leftclick(which means button code 1)
So, simply add this code into ol.interaction.Draw's option.

condition: function(e) {
  // when the point's button is 1(leftclick), allows drawing
  if (e.pointerEvent.buttons === 1) { 
    return true;
  } else {
    return false;
  }
}

https://codepen.io/anon/pen/PRmJYb

Answer 2

For OpenLayers 7.1.0 the condition is the folowing:

condition: (e) => e.originalEvent.buttons === 1

Answer 3

And even higher OL

condition: (e) => {
          const pointerEvent = e.activePointers[0];
          if (pointerEvent.buttons === 1) {
            return true;
          } else {
            return false;
          }
        },