How do I add desired layers to a Layer List?

[DanielSchatt]

hi, I'm a new user of this dijit and I can't get my two layers (a dynamic map service and a tiled map service base map) to show up in the layer list properly. Tried two different ways:

1)  When I add my base map as a "basemap" property in my map, both layers do display, but the base map displays in the LayerList as "layer0".  Setting the "id" property of the map to the name I want doesn't change that. So how do I change the name that is displayed?

2)  When I explicitly create the base map layer by creating a new ArcGISTiledMapServiceLayer, the LayerList will only display whichever layer is added first in the map.addLayer statement.  How do I get it to add all the layers?

Code below, sorry the code insertion thing just isn't working for me so it's regular text.  Thanks much for any tips!

Dan

map = new Map("map", {

    //basemap: "topo",

    id: "Base map",

    center: [-76.7, 37.786],

   /zoom: 11

    scale: 2000000

});   

// Add base layer

var basestreet = new ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/arcgis/rest/services/World_Street_Map/MapServer", {

      id: 'street'

});

basestreet.setVisibility(true);

// Add dynamic layer

var shorelineAssessmentMapperLayer = new ArcGISDynamicMapServiceLayer

("http://cmap.vims.edu/arcgis/rest/services/ShorelineAssessmentMapper/MapServer", {

          id: 'Shoreline Assessment Mapper'

});

shorelineAssessmentMapperLayer.setVisibility(true);

map.addLayer(basestreet, shorelineAssessmentMapperLayer);

// Create layer list

var myWidget = new LayerList({

        map: map,

        layers: [],

        showLegend: true,

        showSubLayers: true

},"layerList");

myWidget.startup();

[KenBuja]

In the LayerList constructor, you can use the layers property to define which layers you want to add.

var myWidget = new LayerList({
        map: map,
        layers: [{
            layer: shorelineAssessmentMapperLayer,
            id: "Assessment Layer",
            content: "horizontalSlider",
            showOpacitySlider: true,
            showSubLayers: true
        },
        {
            layer: basestreet,
            id: "Streets",
            content: "horizontalSlider",
            showOpacitySlider: true,
            showSubLayers: true
        }],
        showLegend: true,
        showSubLayers: true
},"layerList");
myWidget.startup();

[DanielSchatt]

Thanks again Ken. For some reason, this isn’t working. I’m trying the following code:

map.addLayer(basestreet, shorelineAssessmentMapperLayer);

var myWidget = new LayerList(],

showLegend: true,

showSubLayers: true

},"layerList");

myWidget.startup();

The shorelineAssessmentMapperLayer is displaying in the LayerList but all the text (the layer title on top and all the sublayer titles) is grayed out and the sublayers don’t display.

When I take out the my base map layer (basestreet) from the addLayer statement, then the LayerList displays the shorelineAssessmentMapperLayer properly and everything works. But of course, then I don’t have my base layer in the map.

Any idea what the problem is?

[KenBuja · Accepted solution]

There was one thing I overlooked in your original code. You were using

map.addLayer(basestreet, shorelineAssessmentMapperLayer);

but should have used

map.addLayers([basestreet, shorelineAssessmentMapperLayer]);

Take a look at this to see it working properly: JS Bin - Collaborative JavaScript Debugging

[DanielSchatt]

outstanding!  all good now and thanks much!

[DanielSchatt]

sorry! here's the full code:

map.addLayer(basestreet, shorelineAssessmentMapperLayer);

var myWidget = new LayerList({

   map: map,

   layers: [{

      layer: shorelineAssessmentMapperLayer,

      id: "shorelineAssessmentMapper"

   }],

   showLegend: true,

   showSubLayers: true

}, "layerList");

myWidget.startup();