Question

I have an array of objects that I’ve created using Javascript. The objects are map layers and have various properties associated. Upon creation they are pushed into an array. Below is a simplified example

var activeLayers = [];
var mapLayer1 = new mapLayer();
mapLayer1.name = 'roads';
mapLayer1.class = 'infrastucture';
mapLayer1.type = 'line';
activeLayers.push(mapLayer1);

var mapLayer2 = new mapLayer();
mapLayer2.name = 'cities';
mapLayer2.class = 'infrastucture';
mapLayer2.type = 'point';
activeLayers.push(mapLayer2);

var mapLayer3 = new mapLayer();
mapLayer3.name = 'counties';
mapLayer3.class = 'boundaries';
mapLayer3.type = 'polygon';
activeLayers.push(mapLayer3);

var mapLayer4 = new mapLayer();
mapLayer4.name = 'zoningDistricts';
mapLayer4.class = 'political';
mapLayer4.type = 'polygon';
activeLayers.push(mapLayer4);

What I want to do is force my map to not allow more than one layer of type==polygon to be displayed at the same time. I would like to iterate through the array ‘activeLayers’ and if type==polygon.length > 1 then I would like to remove the oldest from the map. Removing a layer from the map is accomplished with a function of

mapLayer3.hide();

In the above array mapLayer3 is a polygon and was added before mapLayer4 and would be hidden from the map.

Thanks for taking a look.

Answer 1

Try this.

var prevPoly = null;
for(var i = 0;i < activeLayers.length;i++){
    if(activeLayers[i].type == 'polygon'){
        if(prevPoly){
           prevPoly.hide();
           break;
        }
        else{
           prevPoly = activeLayers[i];
        }
    }
}

}