nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

LayerList widget expand on startup

NatashaManzuiga

Hello,

I want to know if there is a way to expand RootLayer at the LayerList widget startup.

Thanks,

Naty

Trouver plus de publications taguées avec

Accepted answers

All comments

RobertScheitlin__GISP

Rex,

The "turn all layers on" menu option only turns parent layers on it does not alter sublayer visibility.

RexRobichaux

Hey @RobertScheitlin__GISP - this is great! (sorry for bringing up an old post by the way). This really helped make our grouped layer lists more user friendly in our new app.

I did encounter one issue...admittedly, I didn't test this before the code change so I'll go back and verify... however after the change, if/when I choose to "Turn All Layers On", nothing happens. Similarly, if I opt to "Turn All Layers Off" only the parent / root parent turns off now. Have you experience this? We are using the Foldable theme in WABD 2.17. Thanks for any help you can provide!

layerlist1.png

layerlist2.png

RobertScheitlin__GISP

Warren,

It goes after it but based on the code you provided you are using minified code and that poses a problem. I am not sure it will work for you.

WarrenMedernach

Hey Robert, I tried implementing this but it's not working.

Is this snippet supposed to replace the existing 'onMenuClick' code or go after it?

Existing last line:

<SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">own</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="token function">p</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>operationsDropMenu<SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"onMenuClick"</SPAN><SPAN class="punctuation token">,</SPAN> m<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>_onOperationsMenuItemClick<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

Thanks!

Warren

RobertScheitlin__GISP

Naty,

Don't forget that your original question as already been answered.

NatashaManzuiga

Its visibility must always be active and it's redundant to see it in LayerList.
Naty

RobertScheitlin__GISP

Not that I know of. Why would you want to? If the root was hidden how would you change it's visibility?

NatashaManzuiga

Thanks Robert!

And can I hide root node?

Naty

RobertScheitlin__GISP

Naty,

Sure add this code block to the end of the _initOperations function in the LayerListView.js file:

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">own</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>operationsDropMenu <SPAN class="punctuation token">,</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="string token">'onMenuClick'</SPAN><SPAN class="punctuation token">,</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>_onOperationsMenuItemClick<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="token function">setTimeout</SPAN><SPAN class="punctuation token">(</SPAN>lang<SPAN class="punctuation token">.</SPAN><SPAN class="token function">hitch</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="keyword token">function</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">{</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">foldOrUnfoldAllRootLayers</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">false</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="number token">300</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Rejoindre la conversation

Les membres connectés peuvent publier, suivre les mises à jour, et plus encore. Nouveau ici ? Inscrivez-vous gratuitement.

Liens rapides

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.