Toggle Layers

[deleted-user-K_IRAXrpGKsG]

Hello,

I'm working on a campus map for my university and have run into a problem with toggling layers.

I want to allow a user to click on a button to bring up a layer, and close any existing layers at the same time.

In other words, if the user wants to view the layout of the basement, but the 2nd floor layer is open, when the user clicks on the basement layer the 2nd floor layer closes.

Here is the code for my layers, if anyone has any ideas please let me know!

 dojo.require("esri.map");
 dojo.require("esri.layers.FeatureLayer");
 dojo.require("dijit.form.Button");

 var map;
 var First, Second, Third, Basement;

function init() 
{

 map = new esri.Map("mapDiv");

 var spatialRef = new esri.SpatialReference({wkid:102100});
 var startExtent = new esri.geometry.Extent();
 startExtent.xmin = -9878803;
 startExtent.ymin = 5287431;
 startExtent.xmax = -9878680;
 startExtent.ymax = 5287586;
 startExtent.SpatialReference = spatialRef;

 map.setExtent(startExtent);
    var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/uwwbase/MapServer", {id:basemap});
    map.addLayer(basemap);

 Basement = initLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/uphamhall2/MapServer/3", "Basement");
 First = initLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/uphamhall2/MapServer/2", "First");
 Second = initLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/uphamhall2/MapServer/1", "Second");
 Third = initLayer("http://studentgisserver.uww.edu/ArcGIS/rest/services/uphamhall2/MapServer/0", "Third");
}
 //problem is these functions somewhere \/ \/

     function initLayer(url, id) {
        var layer = new esri.layers.FeatureLayer(url, {id:id, visible:false});
  map.addLayer(layer);
        return layer;
      }

      function changeMap(layer) {     //function used in button. loads layers, does not unload
        //hideImageTiledLayers(layer);
        for (var i=0; i<layer.length; i++) {
          layer.show();
        }
      }

    function hideImageTiledLayers(layer) {
        for (var j=0, jl=map.layerIds.length; j<jl; j++) {
          var layer = map.getLayer(map.layerIds);
          if (dojo.indexOf(layer, layer) == -1) {
            layer.hide();
          }
        }
    }

dojo.connect(map,"onLoad");

dojo.addOnLoad(init);

Thanks!

[StephenLead]

function changeMap(layer) {
        //hideImageTiledLayers(layer);

There's a comment before the hideImage function, so it doesn't actually run - could that be it?

[deleted-user-K_IRAXrpGKsG]

Thanks for the help, but that isn't what I'm looking for. That doesn't allow me to toggle 4 layers.

[JeffPace]

I am not sure where your "change map" button is, but assuming you have something in other code that actually calls the changemap function

I would just do

function changeMap(layer) { 
   dojo.forEach(map.layerIds, dojo.hitch(this, function(layerId){
   map.getLayer(layerId).hide();
   }));

  map.getLayer(layer).show();

}

[deleted-user-K_IRAXrpGKsG]

Thanks Jeff, but that code has map.getLayer(layer).show(); is coming up as undefined.

[JeffPace]

Thanks Jeff, but that code has map.getLayer(layer).show(); is coming up as undefined.

put alert(layer); right before it, and makes sure you are passing in your layer name correctly.