Combine legend and layer visibility into one widget

1637
3
06-23-2020 06:22 PM
Status: Open
acarmody
New Contributor III

Hi there,

Request/suggestion/plea to allowed combined functionality of these 2 widgets across all ESRI products (WAB, ExB, Dashboards etc). Please see an example of suggested legend/layer functionality here, https://maps.cityofsydney.nsw.gov.au/accessibility-map/ It's not polished but gives you the basic idea...


Combining functionality would increase screen real estate and improve UX.

Using 2 widgets, separately, we've found is confusing for the user.

If anyone has a workaround I would love/appreciate/be ever grateful if you could share.

Many thanks,

Alannah

3 Comments
JamieLambert

Thanks for the example Alannah C‌. I like it, though it would be good to see in the legend/layers list what is turned off. Otherwise its a great idea to simplify. Don't forget the mobile apps!

acarmody

My current workaround is  Lee Penny's Interactive Legend Idea.
Hopefully this functionality will be available in Experience Builder too (as outlined by THAYNES.BC here Filter widget functionality in Experience Builder to match WAB).

KevinMacLeod3

Good idea and I agree. I'd like to see the legend integrated into the JS API 4.x in the API LayerList widget officially. 

 

The WebApp Builder Layer List does have a good legend built in. It can be the example to follow. However, the user has to know to click the layers to see it. But, not a problem. I use jQuery to 'click' and expand some of the items with one or two legend symbols. Works great. (though watch the node IDs, they change when you readd services to the webmap) I keep the ones with a dozen or more minimized. With a tooltip advising to expand them to see the legend. So the way it works in WebApp Builder is fairly good, and I'd like to see it integrated into the 4.x API like how it is currently in WebApp Builder.   Suggestion, when adding to 4.x JS API:   It should be as easy to configure as Legend: "true" and then per each subLayer Expand: "true" for each, to determine if they are expanded. With an optional "ExpandedAll: "true" property to expand them all.