Toggle layers on and off in ArcGIS story maps

18801
19
Jump to solution
01-23-2015 06:54 AM
ValenLau
New Contributor

I have been very impressed with the idea of using ArcGIS story maps to show content and having the ability to customize the story map to your liking.

I would like to know if it is possible to have the user turn off/on layers within the legend in the story map template? Are there any sample codes in which I can refer to?

I know I could use ArcGIS JavaScript API to accomplish this, but I would like to stick with ArcGIS story maps if possible.

Thank you.

19 Replies
OwenGeo
Esri Notable Contributor

Hi Michael,

In that case you might want to look at the Web AppBuilder. It is available as a separate tab when you share your map as a web application and provides a wizard-driven app design experience.

Screen Shot 2015-02-20 at 8.08.13 AM.png

Each story map app is designed for a very specific, focused user experience whereas WAB lets you create more generic apps with the standard tools GIS users are familiar with. For example it has a layer list widget that supports the functionality I believe you are looking for (see screenshot below).

If you want to publish an app for a more professional audience that lets them explore your data, make their own decisions about which layers are visible, and perhaps support other typical GIS functions (like viewing the attribute table) WAB lets you do that without any coding. The WAB also creates web apps that provide a good user experience in a desktop/laptop browser as well as on tablets and phones.

Screen Shot 2015-02-20 at 8.06.43 AM.png

Owen Evans
Lead Product Engineer | StoryMaps
MichaelLohr
Occasional Contributor II

Owen, I tried the Web App Builder and it does very well. I am able to do all the things I wanted to and have the detail layer toggling needed.

This must be a new functionality, maybe with the December update. I had not used it before. Thank you for tipping me off about it. I can't call the original post 'Answered' since I was not the original author, but you have answered my questions. Thanks again.

DamonSather
New Contributor

This is all correct, you can toggle layers on and off using the Web App Builder, and most templates, but you can't use Tabs like you can in story maps, which is what my client wants.  I need to be able to have tabs with different layers, and be able to toggle them all.  Frustrating.

0 Kudos
StephenSylvia
Esri Regular Contributor

Damon, I'm sorry this experience has been frustrating. As has previously been mentioned, we strive to make our apps as simple to use and as engaging as possible for the most number of individuals. Because of this we unfortunately cannot meet every specific use case while still keep a clean, easy to configure app but we work hard to meet as many as possible. Through much of our testing, we have found that users who are new to online maps or just unfamiliar with a specific find it very confusing when they are presented with a list map layers to toggle on/off. There tends to be no context for the user to know why one layer is more important than another or how it relates with the rest of the layers in the map. For this reason we have designed our apps to always give context to the user before layers are turn on/off such as providing narrative context with map actions in the Map Journal or changing subject with tabs in our Map Series. We believe that adding this context helps the audience of a story quickly and easily understand the major "take-aways" of the story.

That being said, we understand that this structure is not ideal for every situation, especially when presenting your story to a more professional audience, to subject experts, or when more exploration of a topic is required. For your case, you may be able to use one of the two following scenarios:

1. Customize the app code to add a layer toggle

All of our apps are open source Github. You can find links to the code by clicking the "learn more" button next to the app of your choice on our app's list page then scroll down to the "Developer" section. The ArcGIS API for JavaScript already has an available widget that would allow a JavaScript developer to add the component with only a couple lines of code.

Pros:

  • Faster loading experience
  • Best integration as CSS can be added to the widget to make the look and feel match the rest of the app
  • Better mobile experience

Cons:

  • Requires a developer
  • Requires you to host the final code

2. Embed the Web App builder in the Map Series

Both our Map Series app and Map Journal app allows you to choose what type of content you want in the main content area. This can be web maps from ArcGIS Online, photos, videos, or embed websites. Because the Web App Builder is just a web site, you can just embed it within the Map Series. Anytime you need a different map with a different set of layer toggles, publish that out as a new Web App Builder then embed it's URL into the story map. Here's a blog that explains how to embed apps within story maps: Embedding a Story Map within a Story Map | ArcGIS Blog.

Pros:

  • Everything can remain hosted on ArcGIS Online, no need to download anything.
  • No developer is required.

Cons:

  • Sections that have apps embedded tend to load a little slower and may not work as well on mobile
  • May not be able to match app styles exactly.

Hope this helps.

StevenDouglas1
New Contributor III

You seem to be the only person who can answer these questions from ESRI. The question above was answered, and I can see in my own maps that I can toggle shapefiles on and off, but the raster layers that I put into my web app cannot be toggled on and off (Re: Toggle layers on and off in Web AppBuilder )

Why is that?

0 Kudos
DamonSather
New Contributor

Stephen,

This works! So easy. Much, much appreciated. Send me a survey so I can give you high marks, seriously.

Damon Sather

Sr. GIS Analyst, National

JLL

tel +1 312-228-3928 Fax +1 312-601-1393

Damon.Sather@am.jll.com<mailto:Damon.Sather@am.jll.com>

GIS Business Solutions Web Page<https://connect.joneslanglasalle.com/AM/Brokerage/Business%20Accelerators/GIS/Pages/default.aspx>

www.jll.com<http://www.jll.com/>

0 Kudos
DerekPhyn
Occasional Contributor

Also note if you embed a webapp in a story map you lose the ability to synchronise maps across the story map tabs... See...

https://community.esri.com/ideas/15914 

0 Kudos
MichaelRobb
Occasional Contributor III

Why dont you build apps using WABde then point each tab in the Series Map to each WebApp built in WABde.. I do this all the time.  The Web app built using WABde loads in each Tab. done!

0 Kudos
TobyMunro
New Contributor

Owen, how have you managed to get grouped data within your webmap? I can't figure out how to create groups for like data to enable easy toggling...

0 Kudos
OwenGeo
Esri Notable Contributor

Toby Munro -- Those are map or feature services that have been authored with ArcGIS for Desktop.

Owen Evans
Lead Product Engineer | StoryMaps
0 Kudos