Dynamically Create Layer List Help

[MichaelLisovich]

I'm trying to use the script from https://developers.arcgis.com/javascript/jssamples/map_dynamiclayerlist.html in order to create checkboxes for the layers on the map. I've managed to get the script working, but can only add one array of layers. If I try to add another ArcGISDynamicMapServiceLayer line it overwrites the first one. Is there a way to add multiple arrays to the same script?

[KenBuja]

Can you post your code at JSBin (or Fiddle) to show what you've done so far?

[MichaelLisovich]

I've included the relevant parts of the code here: http://jsbin.com/rewopido/2/edit?html

[KenBuja]

You have a problem in the first script where the modules and arguments are not in the correct order. The arguments in the function must be in the same order that they are called in require. The modules that don't need an argument in the function can come in any order after the ones that need the argument in the function. You're also repeating several modules (BorderContainer and ContentPane)

    require([
      "esri/map", "esri/layers/FeatureLayer", "esri/dijit/Legend","esri/dijit/BasemapGallery", "esri/arcgis/utils",
      "dojo/_base/array", "dojo/parser", "esri/dijit/LocateButton", "esri/dijit/HomeButton", "esri/dijit/OverviewMap", "esri/layers/ArcGISDynamicMapServiceLayer",
      "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dijit/TitlePane","dijit/layout/AccordionContainer",
      "dojo/domReady!"
    ], function(
      Map, FeatureLayer, Legend,BasemapGallery, arcgisUtils,
      arrayUtils, parser , LocateButton, HomeButton, OverviewMap, ArcGISDynamicMapServiceLayer
    ) 

I'm still working on how to add layers from multiple services.

[MichaelLisovich]

I will work on rectifying that situation. I've tried over the last few days to find a way to add multiple layers, but no such luck thus far.

[KenBuja · Accepted solution]

This example adds checkboxes for each layer in two different services. The code uses indexOf, which doesn't work in IE8 and below. If you need that, take a look at this thread.

[RobertKirkwood]

I have a similar question to all of this. i have several table of contents that are grouped by types of data. The client wants a separate legend that they can open and see a list  of layers that are checked in the other TOCs and be able to check the layers in the new TOC for identifying. Here is a screenshot of what i have so far:

The bottom left is the new TOC that i want to just list visible layers that are turned on elsewhere. Thanks!

p.s. i know its redundant but that's what they want!

[AmeliaMalcolm]

Wow!  I think this is exactly what I've been looking for.

        
         map.on("layers-add-result", function (evt) {
                         buildLayerList(evt)
                     });

                     function buildLayerList(evt) {
                         array.forEach(evt.layers, function (layer) {
                             var vis = [];
                             visible.push(vis);
                             buildCheckboxes(layer);
                         });
                     }

                     function buildCheckboxes(layer) {
                         array.forEach(layer.layer.layerInfos, function (info, index) {
                             var checkBox = new CheckBox({
                                 name: "checkBox" + layer.layer.id + info.id,
                                 value: layer.layer.id + "_" + info.id,
                                 checked: info.defaultVisibility,
                                 onChange: function (evt) {
                                     var thisArray = this.value.split("_")
                                     var layerID = thisArray[0];
                                     var infoID = parseInt(thisArray[1]);
                                     var clayer = map.getLayer(thisArray[0]);
                                     var visArray = clayer.visibleLayers;
                                     var ind = visArray.indexOf(infoID);
                                     if (ind > -1) {
                                         visArray.splice(ind, 1);
                                     }
                                     else {
                                         visArray.push(infoID);
                                     }
                                     if (visArray.length == 0) { visArray.push(-1);}
                                     clayer.setVisibleLayers(visArray);
                                 }
                             });

Unfortunately I have no idea how to integrate it into my (or more precisely my retired boss') code.


I have managed to find only two places which refer to a layer list and buildLayerList in our own code (almost a copy of the original javascript sample)

Up near the variables -

layers = dojo.queryToObject(URLparams).layers;
layerList = (layers) ? layers.split(',') : [];
for (a in layerList ) {
 layerList = parseInt(layerList);
}

and after we have defined the three map services (two of which I want to appear in the layer list - the third is the background map)

 if (layer.loaded) {
  buildLayerList(layer);
 } else {
  dojo.connect(layer, "onLoad", buildLayerList);
 }

I'm confused about what I need to keep as layer and what I need to change to layer1 or layer2.

Appologies for being such a newbie, but any help most appreciated.

[KenBuja]

I would suggest that you start a new thread and give a full description of what you're trying to do. There are sites like JSFiddle or JSBin where you can post your code that works or doesn't work and lets others see and adapt it.

[MarkCunningham1]

What would be the best way to add/use a custom label next to check box instead of using the layer name?
http://jsbin.com/majom/1/edit