Remove highlight from operational layers in LayerList widget

840
6
Jump to solution
10-05-2018 08:10 AM
AndrewL
Occasional Contributor II

Hello, I have added the following code to the LayerList widget to automatically expand the legend of the layers when the web app is loaded. It works fine. However, I don't like that it "highlights" or gives a light grey background to the second of the two layers. Since the layers are scale dependent I feel like you can't tell the difference when the text turns from light grey (layer not visible on the map) to black text (layer visible on the map).

Is there a way to remove this as the default? I have included a screen capture as well. I am using WAB Developer Version 2.9. Thanks.

//bind event Added setTimeout code to automatically expand legend.
setTimeout(lang.hitch(this,
this._onRowTrClick,
layerInfo,
imageShowLegendDiv,
layerTrNode,
tableNode,
{}), 300);

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

No I used this:

          setTimeout(lang.hitch(this,
                     this._onRowTrClick,
                     layerInfo,
                     imageShowLegendDiv,
                     layerTrNode,
                     tableNode), 300);

If using your then the function change would be:

    _onRowTrClick: function(layerInfo, imageShowLegendDiv, layerTrNode, subNode, evt) {
      if(evt === {}){
        this._changeSelectedLayerRow(layerTrNode);
      }
      var fold = this._foldSwitch(layerInfo, imageShowLegendDiv, subNode);
      if(evt.ctrlKey || evt.metaKey) {
        if(layerInfo.isRootLayer()) {
          this.foldOrUnfoldAllRootLayers(fold);
        } else {
          this.foldOrUnfoldSameLevelLayers(layerInfo, fold);
        }
      }
    },

View solution in original post

6 Replies
RobertScheitlin__GISP
MVP Emeritus

Andrew,

   Change this function in the LayerListView.js:

    _onRowTrClick: function(layerInfo, imageShowLegendDiv, layerTrNode, subNode, evt) {
      if(evt){
        this._changeSelectedLayerRow(layerTrNode);
      }
      var fold = this._foldSwitch(layerInfo, imageShowLegendDiv, subNode);
      if(evt){
        if(evt.ctrlKey || evt.metaKey) {
          if(layerInfo.isRootLayer()) {
            this.foldOrUnfoldAllRootLayers(fold);
          } else {
            this.foldOrUnfoldSameLevelLayers(layerInfo, fold);
          }
        }
      }
    },
AndrewL
Occasional Contributor II

Thanks Robert. I edited that function, but I'm not seeing any difference. I cleared the cache too. No errors.

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Andrew,

   What version of WAB are you using? Did you make the change in your apps widgets LayerList folder or the stemApps? When I tested it it work great in my WAB 2.9.

0 Kudos
AndrewL
Occasional Contributor II

I am using WAB Developer 2.9. Yes I made the change in the app widget: WebAppBuilderForArcGIS\server\apps\2\widgets\LayerList\LayerListView.js

When you tested did you include my setTime code also? My setTimeout code is at line 280.

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

No I used this:

          setTimeout(lang.hitch(this,
                     this._onRowTrClick,
                     layerInfo,
                     imageShowLegendDiv,
                     layerTrNode,
                     tableNode), 300);

If using your then the function change would be:

    _onRowTrClick: function(layerInfo, imageShowLegendDiv, layerTrNode, subNode, evt) {
      if(evt === {}){
        this._changeSelectedLayerRow(layerTrNode);
      }
      var fold = this._foldSwitch(layerInfo, imageShowLegendDiv, subNode);
      if(evt.ctrlKey || evt.metaKey) {
        if(layerInfo.isRootLayer()) {
          this.foldOrUnfoldAllRootLayers(fold);
        } else {
          this.foldOrUnfoldSameLevelLayers(layerInfo, fold);
        }
      }
    },
AndrewL
Occasional Contributor II

That worked! Thanks for your help I appreciate it.

0 Kudos