I am developing a map with OpenLayers v5.2.0, and I am having problems for the interaction change.

Currently, I have a function that adds all the controls to the map (selection, draw, etc). Which when it changes to a specific interaction eliminates the other interactions of the map.

The main problem is that I need several maps in the project, but each map has specific interactions. So, I need to separate the assignment of interactions separately, so that I can generate a map with the selection and drawing of circles (for example).

How can I distinguish the interactions of the map when doing map.getInteractions ()? To know which interaction to deactivate and which does not.

`addControlButtons : (map, vectorSource) ->
draw = undefined
snap = undefined
select = undefined
modify = undefined
window.app = {}
app = window.app

app.SelectControl = (button) ->
  changeSelectInteraction = ->

  button.addEventListener 'click', changeSelectInteraction, false
  button.addEventListener 'touchstart', changeSelectInteraction, false

  element = OpenLayers.createElementDiv('select-control', button)
  ol.control.Control.call this, element: element

ol.inherits app.SelectControl, ol.control.Control
selectControl = new app.SelectControl(OpenLayers.createControlButton('S', 'Selección'))

app.DrawPointControl = (button) ->
  changeDrawPointInteraction = ->

  button.addEventListener 'click', changeDrawPointInteraction, false
  button.addEventListener 'touchstart', changeDrawPointInteraction, false

  element = OpenLayers.createElementDiv('draw-point-control', button)
  ol.control.Control.call this, element: element

ol.inherits app.DrawPointControl, ol.control.Control
drawPointControl = new app.DrawPointControl(OpenLayers.createControlButton('P', 'Dibujar Punto'))

app.DrawPolygonControl = (button) ->
  changeDrawPolygonInteraction = ->

  button.addEventListener 'click', changeDrawPolygonInteraction, false
  button.addEventListener 'touchstart', changeDrawPolygonInteraction, false

  element = OpenLayers.createElementDiv('draw-polygon-control', button)

  ol.control.Control.call this, element: element

ol.inherits app.DrawPolygonControl, ol.control.Control
drawPolygonControl = new app.DrawPolygonControl(OpenLayers.createControlButton('D', 'Dibujar Polígono'))

addDrawInteraction = (drawType) ->
  map.removeInteraction select
  modify = new ol.interaction.Modify (source: vectorSource)
  map.addInteraction modify

  draw = new ol.interaction.Draw(
    source: vectorSource
    type: drawType)
  map.addInteraction draw

  snap = new ol.interaction.Snap (source: vectorSource)
  map.addInteraction snap

  draw.on 'drawstart', (e) ->

removeDrawInteractions = ->
  map.removeInteraction draw
  map.removeInteraction snap
  map.removeInteraction modify

addSelectInteraction = ->
  select = new ol.interaction.Select
  map.addInteraction select`

This is my function.

1 Answer 1


You can do instanceof checks when you loop over the collection of interactions.

map.getInteractions().forEach((interaction) => {
  if (interaction instanceof ol.interaction.Select) {

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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