CODEWITHSUNDEEP
javascriptextjsopenlayers-3
davids182009
davids182009

Reputation: 451

OL3 Remove a dragbox interaction

I want to remove an interaction of the map that i added in a js class, but when i try remove that interaction in other class I don't know how to do that, because I can't access to the interaction object in the class that I need.....

I have this code (I add the interaction):

...
var dragBox = new ol.interaction.DragBox({
        condition: ol.events.condition.always,
        style: new ol.style.Style({
            stroke: new ol.style.Stroke({
                color: [0, 0, 255, 1]
            })
        })
    });

    mapa.addInteraction(dragBox);

    dragBox.on('boxend', function(e) {
        if (capaActiva != null) {
            var info = [];
            var extent = dragBox.getGeometry().getExtent();
            var ext = extent.toString().split(',');

            var ext1 = ext[0];
            var ext2 = ext[1];
            var ext3 = ext[2];
            var ext4 = ext[3];

            var tfn = ol.proj.getTransform('EPSG:3857', 'EPSG:4326');
            var textent = ol.extent.applyTransform([ext1, ext2, ext3, ext4], tfn).toString();
...

An the js class to remove interaction:

...
cerrar: function(){
    mapa.removeInteraction(dragBox);
}
...

In the second class I obtain the error:

dragBox is not defined

How can I access and remove the interaction in the second class?

Upvotes: 1

Views: 871

Answers (1)

noveyak
noveyak

Reputation: 3300

dragBox needs to be accessible in both scopes.

Without seeing more of your code its hard to say but you could do

this.dragBox = new ol.interaction.DragBox({
        condition: ol.events.condition.always,
        style: new ol.style.Style({
            stroke: new ol.style.Stroke({
                color: [0, 0, 255, 1]
            })
        })
    });

    mapa.addInteraction(this.dragBox);

    this.dragBox.on('boxend', function(e) { ......

.......................
cerrar: function(){
    mapa.removeInteraction(dragBox);
}

If they are not in the same object then you need to make sure the dragbox variable is accessible from both scopes

Upvotes: 1

Related Questions