⭐ Star filter in Qlik Sense ⭐
Boost your dashboards design with visual filters. No extensions required :)
When designing applications, we should always bear in mind the importance of the visual appearance as it plays a huge part in overall user experience. We need to think about how the user will interact with the reports and make sure the most frequently used filters are clearly defined and easily accessible. The native filter pane object doesn't stand out and so in some cases it can be easily missed by the user. This post is a step-by-step guide to create a visual filter that cannot be missed by any user :)
Let's say we want to filter user reviews by their rating. Instead of selecting 1,2,3,4,5 in a drop down menu of Rating field, it is much more comfortable for the user to simply filter by clicking directly on the stars. This is achievable using native button object (available since February 2020 version) as it can (among other actions) trigger selection in a field.
Loading data to Qlik Sense
Use following inline statement to load sample data:
Ratings: LOAD *, Repeat('★', Rating) as [Stars rating] INLINE [ Rating, Reviewer 5, Presley Coates 5, Alessia Goodwin 5, Alec Keith 5, Ellis Webster 4, Katy Mccormack 4, Brielle Glass 3, Vanessa Bouvet 2, Keanan Cousins 2, Kelise Hamer 1, Allen Grimes 1, Antonina Bentley 1, Pheobe Hawes ];
You will need 5 separate button objects. It is important to keep them in the correct sorting order to avoid confusion. These 5 objects will trigger selection of a specfic value in the field Rating. The button label will change depending on filtered values, it will either display ★ or ☆.
Create a variable vColorStars:
vColorStars = If(GetSelectedCount([Rating]) = 1, GetFieldSelections([Rating]), 0)
Create a button object
Go to Actions and Navigation > Action: Select values in field; Select Rating as a Field and set 1 as Value.
Appearance > General > Label:
=If($(vColorStars) >= 1, '★', '☆')
Appearance > Font styling > Font colour: change the color based on your preference. If you want to use the same color I used, then select By expression and enter value ='#e9c46a'
Appearance > Background: change the color based on your preference. If you want to remove the background, then select By expression and enter value =ARGB(0, 0, 0, 0)
Congratulations, you have just created the first star. When you click on it, it will filter all the reviews with Rating value 1. Copy & paste this button object four times with the same settings and change only the setting in step 3 where you will replace the Value 1 with 2,3,4 and 5.
Create a simple table with fields Reviewer, Rating and Stars and make sure the filter works as desired. Be careful not to re-order your buttons and enjoy your new visual filter!
Getting inspired? There are endless possibilities for using the button objects. You can for example change the image to use it for a different use case or trigger a different action. Let us know in what non-traditional way you used the button object in your dashboards.