Playlist template toggle layer visibility

[DylanBaier2]

Hi, I have been working with the Playlist template and want to create a toggle to change the visibility for categories like in this story map.

Wilderness Forever - Explore the Photos

I have created the checkboxes and am able to click them but they don't turn the categories on or off. I believe I have to add esri/layers/FeatureLayer to some of the javascipt files. I don't have much experience with javascript and have been trying to piece it together but am a little stuck.

Was just wondering if anyone could point me in the right direction. Thanks.

[StephenSylvia · Accepted solution]

This functionality is already build into the playlist app. All you have to do is add a new field “filter” to you playlist points layer. Then set the filter title for each feature. For every unique filter, the app will add a checkbox that toggle those items on/off. Here’s an example that uses it: http://storymaps.esri.com/stories/2013/storylocator/. You’ll notice there is a filter icon next to the search box.

[DylanBaier2]

Thanks, I figured it out.

[AnnIngerson1]

I am trying to use this filter function with the playlist template. My csv file has a filter field and each feature has a filter defined. But no filter option appears on the story map site.

This is a test site with only one feature in each filter category. Does that affect the function?

[StephenSylvia]

Can you post a link to your web map so we can investigate?

[AnnIngerson1]

Thanks,

So sorry – the story map site is not yet public – it resides only on my private computer. The map itself is at http://arcg.is/1KrqGiv . I also have the problem that thumbnails stored on a Google site do not display in Internet Explorer – they work fine in Chrome.

Ann Ingerson

Craftsbury Common, VT

802-586-9625

[StephenSylvia]

The issue is that the filter field must be named exactly “filter” (lowercase f). Alternatively, you should find a filterField option in the config section of the index.html file. If you set it to “Filter,” that should also add the filter correctly. Are your thumbnail images shared publicly? They do not work for me even in Chrome. They would come through in Chrome if that browser was logged into your Google account.

[AnnIngerson1]

Thank you for your speedy assistance. I changed the field name to filter - not capitalized – but the filter option still does not appear in the story map.

The thumbnails were stored on a Google site that is public for all content – I figured a way to host them on Google drive instead and that worked.

Ann Ingerson

Craftsbury Common, VT

802-586-9625

[StephenSylvia]

Sorry, you must explicitly put the field name into the config for the filter to show up in the app.

[AnnIngerson1]

Thank you – that worked! Might want to suggest updating the Readme file to indicate that.

Ann Ingerson

Craftsbury Common, VT

802-586-9625