Update the layers in swipe widget interactively using ArcGIS API for JavaScript

[YunbeiOu]

I want to update the layer to be shown in the swipe widget, including leading layer and trailing layer.

I am able to use event listener to update layer shown in the map when I am not using the swipe widget. But in the swipe widget, how to update the contents according to specific event, for example the response of a radio button? I t is poosible to use view.ui.add(swipe) to change the content in the swipe, but with this method a new swipe will be created each time. 

So, is there any methods to obtain the swipe widget and change its content (the layers) interactively?

[AnneFitz]

Hi @YunbeiOu - check out the Swipe Widget with Scroll sample in our documentation. In this sample, we programmatically update the layers used in the Swipe widget as the user scrolls in the app.

[YunbeiOu]

Thanks Anne! I prefer using radio button to update the layers since there are many layers in the web map. Is it possible to update the content of swipe according to the result of radio button, instead of adding a new swipe all the time? Thanks again!

[AnneFitz]

Yes this is possible! Just update the leadingLayers or trailingLayers properties on Swipe with the layers you want to be included on each side after you click the radio button.

[AnneFitz]

Here's an example using a Calcite component, radio button group, to update the leadingLayers based in the Swipe widget based on the radio selection: https://codepen.io/annefitz/pen/poLVeLq