Fancy Filter Widget(s)
Are your filters fancy? Do you want to make them fancy? Have I got the Widget(s) for you.
Fancy Filter is designed to take a FeatureLayer with a UniqueValueRenderer and make a set of filters with the legend swatches. The end result is you can make a Filter that also works as a Legend. Imagine making a Zoning map application that looks like this.
What else can the Fancy Filter(s) do?
It's got single or multiple selection mode or use Exclude Selection to invert make your choice a NOT clause. It's got a Reset Button to uncheck every filter and a Select All Button to check every filter. Zoom To can zoom your map to the selected stuff. It can count how many features of each type are in the map extent and filter itself so you only see the types of stuff in the map area.
Whoa, that's too much stuff. I don't want all that.
No problem, Fancy Filter(s) have a ton of Builder options. You control what you want your Fancy Filter to do and what you allow your users to do with it.
But what if my text is the wrong size? Won't it look awful?
That's why the Appearance options exist. You choose how big your text is, the size of the filter buttons, whether to use the value or description for the text, and more.
Design Tips:
- Don't use Fancy Filter in a Widget Controller. (It has been tested and is functional in a Widget Controller. It just doesn't look as good.) Place it directly on the Map or in a Column/Sidebar beside it.
- First, go to the Style Tab and set the Width to a fixed number of pixels. Set the Height to Auto.
- Then, set the Card Width to an even divisor of the Width and build the rest of the design around the Card Width.
- Make sure you go to Preview and test that your design works with the functions you have enabled, especially the Count Features function.
- Expect to go through several guess and check revisions.
- Set the Loading Box Height to be slightly higher, ~10px, than the greatest combined height of your filters.
Hey, what's with the (s)s?
Fancy Filter isn't one Widget. It's two Widgets. In two distinct flavors.
Fancy Filter - This is the original flavor. It is designed to filter a single layer, pre-loaded in the Builder. It can (probably) be used without a Map Widget, although some features do require one. It looks like this:
Fancy Filter Runtime - The earlier picture was from Fancy Filter Runtime. I kind of made this Widget by accident. See I was always planning to build on top of Fancy Filter and before I released it to the public I wanted to do a test to see if I could select the DataSource at runtime and pass it into Fancy Filter, in case, I needed to make any modifications to Fancy Filter to accommodate getting the DataSource differently. (Turns out I did. So, good choice me.) Turns out that getting the DataSource at runtime was a challenge maybe more difficult than the original Fancy Filter.
Fancy Filter Runtime requires a Map Widget. It is a wrapper around original flavor Fancy Filter that finds all the DataSources in the project and checks if they are a FeatureLayer with a UniqueValueRenderer, then it allows the end-user to pick what layer to Fancy Filter. It is capable of finding DataSources included in the Map Widget or added at run-time from the Add Data Widget or other Custom Widgets.
Warnings
- Fancy Filter(s) filter at a DataSource level and should filter things in other Widgets like a Table.
- Fancy Filter(s) should get any filters applied when it loads and should include these filters in it's filtering.
- Fancy Filter(s) have been tested with other Widgets applying filters and no adverse interactions were observed.
- I won't guarantee safe and accurate interactions in all circumstances, especially with other Widgets that select or filter data.
- Fancy Filter Runtime may not find every potential DataSource added at runtime it could potentially Fancy Filter.
- There are three ZIP files in this post. The files contained in sharedCodeForFancyFilter must be taken out of their folder and placed directly in your widgets/shared-code folder. You may need to create this folder. Both versions of the Widget require these shared-code files.
Wait, if you weren't planning to make Fancy Filter Runtime, what were you planning to build?
Fancy Filter got started after I was disappointed with how the Interactive Legend Widget turned out. I would like to try putting Fancy Filter into something like a Map Layers List next and eventually turning Fancy Filter into the core of a fully custom Interactive Legend Widget. Which is why basically all the stuff that makes Fancy Filter work is in the shared-code folder, so make sure to see the bold note in the warnings section.
