Cannot get layers to populate layer list

3348
4
07-30-2015 07:36 AM
JosephWallis
New Contributor II

When I add the map service in ArcGIS.com I can get a list of layers that are able to be turned on and off.

 

When I add the same service to my javascript viewer (template viewer) I only get one layer which is the service name.  From what I can tell it looks like I should be getting a list of layers that can be toggled on and off as well:

 

function addLayerList(layers) {     var layerList = buildLayerVisibleList(layers);     if (layerList.length > 0) {         //create a menu of layers         layerList.reverse();         var menu = new dijit.Menu({             id: 'layerMenu',             baseClass: "customMenu"         });         dojo.forEach(layerList, function (layer) {             menu.addChild(new dijit.CheckedMenuItem({                 label: layer.title,                 checked: layer.visible,                 onChange: function () {                     if (layer.layer.featureCollection) {                         //turn off all the layers in the feature collection even                         //though only the  main layer is listed in the layer list                         dojo.forEach(layer.layer.featureCollection.layers, function (layer) {                             layer.layerObject.setVisibility(!layer.layerObject.visible);                         });                     } else {                         layer.layer.setVisibility(!layer.layer.visible);                     }                 }             }));         });         var button = new dijit.form.DropDownButton({             label: i18n.tools.layers.label,             id: "layerBtn",             iconClass: "esriLayerIcon",             title: i18n.tools.layers.title,             dropDown: menu         });         dojo.byId('webmap-toolbar-center').appendChild(button.domNode);     } } //build a list of layers for the toggle layer list - this list //is slightly different than the legend because we don't want to list lines,points,areas etc for each //feature collection type. function buildLayerVisibleList(layers) {     var layerInfos = [];     dojo.forEach(layers, function (mapLayer, index) {         if (mapLayer.featureCollection && !mapLayer.layerObject) {             if (mapLayer.featureCollection.layers) {                 //add the first layer in the layer collection... not all  - when we turn off the layers we'll                 //turn them all off                 if (mapLayer.featureCollection.layers) {                     layerInfos.push({                         "layer": mapLayer,                         "visible": mapLayer.visibility,                         "title": mapLayer.title                     });                 }             }         } else if (mapLayer.layerObject) {             layerInfos.push({                 layer: mapLayer.layerObject,                 visible: mapLayer.layerObject.visible,                 title: mapLayer.title             });         }     }); return layerInfos; }
0 Kudos
4 Replies
KellyHutchins
Esri Frequent Contributor

Are you using a local copy of the template? If so we recently updated the template to support showing layers and sub layers in the list. Perhaps try downloading the latest version of the template from github.

0 Kudos
JosephWallis
New Contributor II

I'm using a version of the template I can no longer find because we were not interested in the look of the new template.

0 Kudos
KellyHutchins
Esri Frequent Contributor

It sounds like you are using the original basic viewer template. You can find the source code for that template here:

Esri/basic-viewer-template · GitHub

You'll need to update that template to the latest version of the JSAPI and add add the LayerList widget to the app:

LayerList | API Reference | ArcGIS API for JavaScript

Alternatively you can take a look at the Map Tools template. It has the same general appearance as the original Basic Viewer and already includes the LayerList widget so you'll see sub layers in the list.

http://www.arcgis.com/apps/MapTools/index.html?webmap=9fd1475b3408403db2ab5059f06a9021

If you choose to use the Map Tools template you can find it in the ArcGIS Online template gallery or if you'd prefer to download the source code you can find that here:

Esri/map-tools-template · GitHub

JosephWallis
New Contributor II

Thanks for the links.

Is it necessary to call the startup method?  I'm just using the sample code and wasn't sure if this was necessary.  From what I can tell of this new widget you don't have to build a layer list like before (which never seemed to work) but I'm not certain how it builds it.

function addLayerList(layers) {
//   var layerList = buildLayerVisibleList(layers);
    var menu = new dijit.Menu({
        id: 'layerMenu',
        baseClass: "customMenu"})

var layerList = new esri.dijit.LayerList({
                map: webmap
            }, "menu");
            layerList.startup();

var button = new dijit.form.DropDownButton({
            label: i18n.tools.layers.label,
            id: "layerBtn",
            iconClass: "esriLayerIcon",
            title: i18n.tools.layers.title,
            dropDown: menu
        });

dojo.byId('webmap-toolbar-center').appendChild(button.domNode);
}

0 Kudos