Using listMode to hide layers in Layerlist

[AshleyPeters]

It's been a while since I've used the JavaScript API, so I'm fairly rusty. I'm in the process of updating several of our maps to the newest API and making the layout more mobile-friendly.

I am using the LayerList with Legend sample code. I'd like to hide two of my three layers from the LayerList. They essentially make up my basemap. Here's my layerlist code currently:

var layerList = new LayerList({
    view: view,
    container: document.createElement ("div"),
        listItemCreatedFunction: function(event) {
            const item = event.item;
            if (item.layer.type != "group") {
              // don't show legend twice
              item.panel = {
                content: "legend",
                open: true
              };
            }
          }
    
    });
    
    var llExpand = new Expand({
    view: view,
    content: layerList.domNode,
    expandIconClass: "esri-icon-layer-list"
    });
    
    view.ui.add(llExpand, "top-right");
    });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

And my layers:

// Add state feature layer
      var stateLayer = new FeatureLayer({
        url: "http://myURL/States/MapServer/0",
      });

      mapMain.add(stateLayer);
      
    // Add counties feature layer
      var countiesLayer = new FeatureLayer({
        url: "http://myURL/AlabamaCounties/MapServer/0",
      });

      mapMain.add(countiesLayer);
      
      // Add WFF districts feature layer
      var WFFdistrictsLayer = new FeatureLayer({
        url: "http://myURL/WFFDistricts/MapServer/0",
        title: "Wildlife and Freshwater Fisheries Districts"
      });

      mapMain.add(WFFdistrictsLayer);‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I'd like to remove the stateLayer and countiesLayer from the layerlist. I believe using listMode will be my best option. I've followed the info in the thread, https://community.esri.com/thread/232289-remove-layers-from-the-layerwidget , with limited success. I've been able to hide one layer, but not both.

Any suggestions on how to best hide multiple layers?

Thanks in advance for your time!

Ashley

[RobertScheitlin__GISP · Accepted solution]

Ashley,

   You just add the listMode property to your layers:

      var stateLayer = new FeatureLayer({
        url: "http://myURL/States/MapServer/0",
      });
      statesLayer.listMode = "hide";‍
      mapMain.add(stateLayer);
      
      // Add counties feature layer
      var countiesLayer = new FeatureLayer({
        url: "http://myURL/AlabamaCounties/MapServer/0",
      });
      countiesLayer.listMode = "hide";‍
      mapMain.add(countiesLayer);‍‍‍‍‍‍‍‍‍‍‍‍

[AshleyPeters]

Thanks Robert! I had tried adding the listMode under the add statement, but I'm not sure that I had tried it above it in that same format.