LayerList 2.1 option to displays sublayer

1892
11
08-29-2016 10:14 AM
New Contributor III

Have anyone know if there is a way to configure a dynamic map server with 3 sublayers, the first layer is active as default. if a user turn on the second sublayer, any displays sublayer within this "Sample Locations" map server will turn off? I don't want a user to manually have to turn off the displays "Active" layer.

Thanks,

Ha Thach

Tags (1)
Reply
0 Kudos
11 Replies
MVP Esteemed Contributor

Ha Thach,

   Here is what I was able to come up with:

In the LayerListView.js:

    _onCkSelectNodeClick: function(layerInfo, ckSelect, evt) {
      if(evt.ctrlKey || evt.metaKey) {
        if(layerInfo.isRootLayer()) {
          this.turnAllRootLayers(ckSelect.checked);
        } else {
          this.turnAllSameLevelLayers(layerInfo, ckSelect.checked);
        }
      } else {
        if(layerInfo.parentLayerInfo && layerInfo.newSubLayers.length === 0 && ckSelect.checked){
          var layerOptions = {};
          var rootLayerInfo = layerInfo.getRootLayerInfo();
          rootLayerInfo.traversal(lang.hitch(this, function(subLayerInfo) {
            if(subLayerInfo.parentLayerInfo &&
               subLayerInfo.parentLayerInfo.id === layerInfo.parentLayerInfo.id &&
               !this.isLayerHiddenInWidget(subLayerInfo)) {
              layerOptions[subLayerInfo.id] = {visible: false};
              if(subLayerInfo.id === layerInfo.id){
                layerOptions[subLayerInfo.id] = {visible: true};
              }
            } else {
              layerOptions[subLayerInfo.id] = {visible: subLayerInfo.isVisible()};
            }
          }));
          rootLayerInfo.resetLayerObjectVisibility(layerOptions);
        }else{
          layerInfo.setTopLayerVisible(ckSelect.checked);
        }
      }
      evt.stopPropagation();
    },
New Contributor II

Hello rscheitlin,

Where in the LayerListView.js is this code supposed to be placed?

Thank you!

Colter

Reply
0 Kudos
MVP Esteemed Contributor

Colter,

   The code is a replacement for the _onCkSelectNodeClick function.

Reply
0 Kudos
New Contributor II

No luck so far Robert Scheitlin, GISP‌. Are there any other alterations that I should keep in mind? I'm just making the change from the downloaded code straight out of ArcGIS Web App Builder. 

Reply
0 Kudos
MVP Esteemed Contributor

Colter,

   So you are saying that you are changing the LayerListView.js file that is directly on your web server?

Reply
0 Kudos
New Contributor II

Hi Robert,

I'm downloading the code from AGO, making the change, and launching up to the web server.

Reply
0 Kudos
MVP Esteemed Contributor

Colter,

   If you are downloading from AGOL then the code is minified... So it will be really hard for you to find the correct spot to replace. You need to be working with WAB Deveedition if you want to make code changes like this.

Reply
0 Kudos
New Contributor II

Hi Robert,

I didn't think it was that hard, but I could have this wrong too. Hopefully this provides enough context for what I did:

_foldOrUnfoldLayers:function(a,b){h.forEach(a,function(a){this._foldOrUnfoldLayer(a,b)},this)},_onCkSelectNodeClick: function(layerInfo, ckSelect, evt) {
      if(evt.ctrlKey || evt.metaKey) {
        if(layerInfo.isRootLayer()) {
          this.turnAllRootLayers(ckSelect.checked);
        } else {
          this.turnAllSameLevelLayers(layerInfo, ckSelect.checked);
        }
      } else {
        if(layerInfo.parentLayerInfo && layerInfo.newSubLayers.length === 0 && ckSelect.checked){
          var layerOptions = {};
          var rootLayerInfo = layerInfo.getRootLayerInfo();
          rootLayerInfo.traversal(lang.hitch(this, function(subLayerInfo) {
            if(subLayerInfo.parentLayerInfo &&
               subLayerInfo.parentLayerInfo.id === layerInfo.parentLayerInfo.id &&
               !this.isLayerHiddenInWidget(subLayerInfo)) {
              layerOptions[subLayerInfo.id] = {visible: false};
              if(subLayerInfo.id === layerInfo.id){
                layerOptions[subLayerInfo.id] = {visible: true};
              }
            } else {
              layerOptions[subLayerInfo.id] = {visible: subLayerInfo.isVisible()};
            }
          }));
          rootLayerInfo.resetLayerObjectVisibility(layerOptions);
        }else{
          layerInfo.setTopLayerVisible(ckSelect.checked);
        }
      }
      evt.stopPropagation();
    },_onPopupMenuClick:function(a,b,c,d){this._changeSelectedLayerRow(c);b&&"opened"===b.state?b.closeDropMenu():(this._hideCurrentPopupMenu(),b&&(this.currentPopupMenu=b,b.openDropMenu()));this.operationsDropMenu&&

I'll have to see what I can get from the Developer's Edition also.

Reply
0 Kudos
New Contributor II

Hi Robert, I attempted to add this code to my widget but it did not provide the described function. I was wondering whether that was because the layers I would like to switch on and off are sub-sublayers? (I have attached an image of my operational layers list, the ones I want to have this exclusive viewing functionality are layers 3-5)

Thanks in advance, I appreciate the help!