Should Not include Basemap layer in Legend

2729
6
08-12-2013 06:00 AM
upendrapaladugu
New Contributor
Hello,

         I have an issue about Legend. In my application i'm using basemap gallery.After map load base map is appears in legend. How to hide the basemap layer in legend. I tried the hidelayers concept (legend is not working), but no luck. Below i add the sample code and image.Anybody have solution for this?

         var legend = new esri.dijit.Legend({
       map : map,
     layerInfos: [{hideLayers: baseMapLayer}]
     }, "legendDiv");
      legend.startup();

                I used  updateLayerVisibility() method for layers on/off.

Thanks

[ATTACH=CONFIG]26643[/ATTACH]
0 Kudos
6 Replies
KenBuja
MVP Esteemed Contributor
If you don't list what layers you want to appear in the legend in the layerInfo parameter, by default, all the layers will appear, including the basemap. The hideLayers parameter will be the sublayers for a specific layer that won't be shown.

Try this:

var legend = new esri.dijit.Legend({
   map : map,
   layerInfos: [{layer: yourLayer}]
   }, "legendDiv");
legend.startup();    
0 Kudos
JasonZou
Occasional Contributor III
Try to use
var legend = new esri.dijit.Legend({
    map : map,
    layerInfos: [{layer: legendLayer1}, {layer: legendLayer2},...]
}, "legendDiv");

where legendLayer1, legendLayer2, ... are the layers you like to display in the legend. If it does not work either, it is not hard to develop a custom one using REST api.

Good luck!
0 Kudos
upendrapaladugu
New Contributor
Thanks to Ken Buja and Jason Zou for quick reply.

                   I will give more explanation about my layers and legend.


       Html code for checkbox:
 
<li>
<input type='checkbox' class='cbLayers beaches' id='0,1,2,3,4,5' value=603 onclick='updateLayerVisibility(this);'/>
</li>
<li>
<input type='checkbox' class='cbLayers beaches' id='6,7,8,9,10,11' value=1 onclick='updateLayerVisibility(this);'/> 
</li> 
<li>
<input type='checkbox' class='cbLayers beaches' id='12,13,14,15,16,17' value=3 onclick='updateLayerVisibility(this);'/>  
</li>


JavaScript code:

Add LayerCode:     "Add layers to the Map"
 
  function mapAddLayer(layer) {
  if(layer.declaredClass == "esri.layers.FeatureLayer") {
  var pt = layer._url.path.split("/").slice(-1)[0];
  map.FeatureLayer[pt] = layer;
  } else {
  map.addLayer(layer);
  }
  }


For Layer on/off code:
 
  var inputs = dojo.query(".cbLayers");
  for (var i = 0; i < inputs.length; i++) {
  if (inputs.checked) {
  console.log(inputs);
  updateLayerVisibility(inputs);
   }
  }

        function updateLayerVisibility(el) {
  var ptids = el.id.split(",");
  if(el.checked) {
  for(var i = 0; i < ptids.length; i++) {
  ptlayer = map.FeatureLayer[ptids];
  map.addLayer(ptlayer);
  }
  } else {
  for(var i = 0; i < ptids.length; i++) {
  var ptlayer = map.FeatureLayer[ptids];
  map.removeLayer(map.getLayer(ptlayer.id));
    }
   }
  }

Legend code:
  var legend = new esri.dijit.Legend({
       map : map,
     }, "legendDiv");
      legend.startup();


BaseMap code:
  var basemaps = [];
  var streetBasemap = new esri.dijit.Basemap({
   layers : [Street_Map_TemplateLayer],
   title : "Streets",
   thumbnailUrl : "images/Streets.png"
   });
   basemaps.push(streetBasemap);  // ("Like the way i added all the basemap layers");
  
   dojo.forEach(basemapGallery.basemaps, function (basemap) {
   dijit.byId("baseMenu").addChild(new dijit.MenuItem({
   label : basemap.title,
   onClick : dojo.hitch(this, function () {
   this.basemapGallery.select(basemap.id);
   })
   }));
   });

     Here i have multiple feature layers and grouped by category wise(check box ids are same as layer ids).

Thanks
0 Kudos
JasonZou
Occasional Contributor III
Several thoughts about your code.
1. Seems like all the feature layers are from the same map service. If so, why load the whole map service instead of creating feature layer for each which is very expensive. Unless you want more controls to each layer, I would load the map service instead. In the map service, you can group the layers into group layers, and still control the layer visibility using the checkboxes you created via layer.setVisibleLayers().
2. I would use layer.hide() to turn off a layer instead of removing it from the map.
3. In the legend constructor, you haven't defined the layerInfos. Since the API does not provide a way to update the layerInfos, all the layers (feature layers, basemap layer and any other layers) must be loaded first before creating the legend.
0 Kudos
KenBuja
MVP Esteemed Contributor
Have you also looked at the TOC widget that nlui has built?
0 Kudos
upendrapaladugu
New Contributor
Thanks to Ken Buja and Jason Zou for reply.

As per the requirement we used the services like the above.

I wrote one function for delete the basemap layer in legend. It's working fine on load the application.



function legendDisplay()
   {
   var domNode = legend.domNode;
  
   for (k=0;k< legend.domNode.childNodes.length;k++) {
  
   var nodeid = legend.domNode.childNodes.id
    var str =nodeid.substring(0,15);
     if ( str =="legendDiv_layer"){
     //if ( nodeid="legendDiv_layer0"){
    legend.domNode.removeChild(legend.domNode.childNodes);
    k=k-1;
     }
     }
   }


I used this function map onLoad function. But the problem is after change the basemap layer , the basemap layer displays in legend. Is there any event for basemap layer change event. I tried in

dojo.forEach(basemapGallery.basemaps, function (basemap) {
//Add a menu item for each basemap, when the menu items are selected
   dijit.byId("bingMenu").addChild(new dijit.MenuItem({
   label : basemap.title,
   onClick : dojo.hitch(this, function () {
   this.basemapGallery.select(basemap.id);
  
   legendDisplay();
 
   })
   }));
  
   });

and 

basemapGallery.on("selection-change", function(evt) {
   legendDisplay();
   });


and

dojo.connect(map, "onBaseChange", mapReady1);
   
function mapReady1(map){

  bool=true;

   legendDisplay();
  
     }


The above three functions are inside init() only.
Can you please suggest the solution for this...


Thanks
Upendra
0 Kudos