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();
Solved! Go to 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
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();
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?
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
outstanding! all good now and thanks much!
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();