LayerList 2.1 option to displays sublayer

3287
11
08-29-2016 10:14 AM
haThach
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)
0 Kudos
11 Replies
RobertScheitlin__GISP
MVP Emeritus

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();
    },
ColterSikora1
New Contributor II

Hello rscheitlin,

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

Thank you!

Colter

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Colter,

   The code is a replacement for the _onCkSelectNodeClick function.

0 Kudos
ColterSikora1
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. 

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Colter,

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

0 Kudos
ColterSikora1
New Contributor II

Hi Robert,

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

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

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.

0 Kudos
ColterSikora1
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.

0 Kudos
ShannonHealy1
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!