Vizlib Filter

Vizlib Filter is a highly customisable, supported and easy-to-use filter component for Qlik Sense to make selections in the data model. It supports different views as Listbox, Buttongroup and Dropdown and provides you with a lot of features as custom styling options, interactivity options, one-selected-value, default-values and many more.

Vizlib Filter
Vizlib Filter
Vizlib Filter
Vizlib Filter
Vizlib Filter

Vizlib Filter is a control component extension and helps you handle and present date fields in a much more user-friendly way, allowing you to build intuitive and compelling dashboards for your users.

Benefits and Features:

  • Three different component types supported: Listbox, Dropdown, Buttongroup
  • One selected value option as well as default selections
  • Support of all Qlik filtering possibilities, including locking fields, selecting excluded and alternative
  • Multiple Search Types
  • Qlik Selection state aware
  • Drilldown field & Master Item compatible
  • Export Field values to XLS and copy cell value on right-click.
  • Powerful and user-friendly search functionality which 100% leverages the Qlik Engine API.
  • Conditional show&hide of filter values.
  • Vizlib rich formatting options to style your filter to your company brand

Download Vizlib Filter

Up to 5 users free.

Terms & Conditions

Vizlib Filter

Readme

  1. Installation
    1.1 Qlik Sense Server
    1.2 Qlik Sense Desktop
  2. Features
  3. Field Settings
  4. Listbox Settings
    4.1 Listbox Styling
    4.2 Cell Styling
    4.3 Header
  5. Dropdown Settings
    5.1 Dropdown Styling
    5.2 Cell Styling
  6. Buttongroup Settings
    6.1 Buttongroup Styling
    6.2 Button Styling
  7. Interactivity
  8. What's new?
  9. Feedback & Bug Reporting
  10. Terms & Conditions


1. Installation

1.1 Qlik Sense Server
  1. Download the .zip file from the link provided your eMail.
  2. Visit the QMC on of your Qlik Sense Server.
  3. Import the .zip file in your extension tab.
  4. Open Qlik Sense and add the 'Vizlib Filter' extension to a sheet.

1.2 Qlik Sense Desktop
  1. Download the .zip file from the link provided your eMail.
  2. Extract the .zip file to your default extension folder (documents/qlik/sense/extensions) in Qlik Sense.
  3. Open Qlik Sense and add the 'Vizlib Filter' extension to a sheet.

2. Features:

  1. Three different component types supported: Listbox, Dropdown, Buttongroup
  2. One selected value option as well as default selections
  3. Support of all Qlik filtering possibilities, including locking fields, selecting excluded and alternative
  4. Qlik Selection state aware
  5. Export Field values to XLS and copy cell value on right-click.
  6. Powerful and user-friendly search functionality which 100% leverages the Qlik Engine API.
  7. Conditional show&hide of filter values.
  8. Vizlib rich formatting options to style your filter to your company brand
  9. Responsive mode for dynamic screen resolutions
  10. Up to 5 users free.


3. Field Settings:

This is where you can choose and pick your filter field, be it a single dimension, a drilldown or a master item dimension.
Vizlib Filter

Beyond that, the field settings will also permit you to configure other powerful properties such as:

Filter Values
Here you have the ability to achieve two things:

  1. Hide and show dimension values from the collection of available items using an expression (true() will show the dimension value, false() will hide it). e.g. if you add =if(Only({1} Month)='Feb',true(),false()) you will only display dimension values which are available in Feb

  2. You can add the Frequency Count to the field value. In there you can pick and choose from relative/absolute/percentage frequency representation.

Sort Options
By default, the field is sorted by its selection state, but in here, you can modify the setting. You can choose sorting by six different ways, including a combination of all six of them. It's important to note the defined order of sort properties is fixed by Qlik.

4 Listbox Settings

If the Listbox is chosen as the filter type, there are several of interesting options you can choose from before you proceed with the detailed styling options.
Vizlib Filter

Selection Bar
The selection bar is a very thin bar which indicates the number of selected vs available or excluded values in the field. It's very useful if you wish to get a feeling of how many values the dimension has, and see it respond to your selections:
Vizlib Filter

Responsive
Naturally, Listboxes are very long objects, but instead of always having a vertical scrollbar, you might want to make the filter responsive to the user's screen size. This means, that once the object is very small, it automatically transforms into a dropdown. In such a case, all dropdown settings are inherited.
Vizlib Filter

Style
Here you can change the styling of your listbox values with options such as None, LED, Tick and Checkbox.

  • LED
    Vizlib Filter
  • Tick
    Vizlib Filter
  • Checkbox
    Vizlib Filter


4.1 Listbox Styling

While the Listbox styling is mostly defined by its cell values, you still have the possibility to add a border to make your filter look a little bit more like a card:

Property Settings:
Vizlib Filter

Resulting Listbox with Border:
Vizlib Filter


4.2 Cell Styling

This section permits you to style individual cells of a Listbox. It's full of different customization possibilities which categorise themselves into the following sections:

  • Size Settings (Height)
  • Font Styling
  • Row Border
  • Text Alignment
  • Coloring Type (Qlik vs Custom)

Vizlib Filter


4.3 Header

The header always sits on top of the Listbox which offers rich customization options. Most relevant are:

  • Show/Hide the Header
  • Custom Header Title (supports expression)
  • Font Properties
  • Actions
  • Send to Excel icon on header bar
  • Clear Field icon on header bar

Vizlib Filter
Vizlib Filter

5 Dropdown Settings

The Dropdown settings are very similar to the Listbox settings with some minimal differences.
Vizlib Filter
Dropdown Label
Similar as with the Header in the Listbox, the Dropdown Label will allow you to replace what is displayed in the Dropdown when it is collapsed. It usually makes sense

Style
Here you can change the styling of your Dropdown values with options such as None, LED, Tick and Checkbox.

  • LED
    Vizlib Filter
  • Tick
    Vizlib Filter
  • Checkbox
    Vizlib Filter


5.2 Dropdown Styling

Dropdown Styling sections permits you to change the style of the collapsed dropdown button by changing the background and font color for a better themed look:

Settings:
Vizlib Filter

Look:
Vizlib Filter


5.3 Cell Styling

This section permits you to style individual cells of the Dropdown when it's expanded. It's full of different customization possibilities which categorise themselves into the following sections:

  • Size Settings (Cell-Height)
  • Font Properties
  • Text Alignment
  • Coloring Type (Qlik vs Custom)

Vizlib Filter

6 Buttongroup Settings

The Buttongroup is the third display type of the Vizlib Filter and allows you to visualize selectable dimension values in button format. Next, to different styling options, you can also define the positioning and size of the button(group).


6.1 Buttongroup Styling

This section organizes and styles the dimension value buttons as a whole. You can define the following properties:

  • Orientation of Buttons (Horizontal/Vertical)
  • Spacing to increase the distance between the buttons
  • Grouped, to style the button collection as a button group, similar to a horizontal Listbox

Vizlib Filter


6.2 Button Styling

This section lets you customize and style the individual button style. It is rich with settings and options catering to any styling requirement or imagination:

  • Button Size (Width & Height)
  • Border Settings
  • Font Properties
  • Text Alignment
  • Coloring Type (Qlik or Custom)

Vizlib Filter

7 Interactivity

Interactivity provides you with a set of options which allow you to control how the user can interact with the Vizlib Filter

  • Selection Mode:
    Here you can choose how the filtering is done in the Vizlib Filter. You can enable Multiselect, Drag Select or make the whole object read-only, preventing the user from making selections.

  • General Options:
    Here you can Show/Hide Alternatives, Excluded values and define a set of default values. When the field has no selections, either because it was manually cleared or because it the app just opened, default selections will apply. Multiple default selections need to be comma separated (no space). Only One Selected Value permits the user to select a maximum of one value at a time.

  • Search Options:
    While it would make sense to have the search options active most of the time, here is where you could hide them, position them and define their search mode (Wildcard, Fuzzy, Expression)

  • Icons:
    Hide and Show Qlik Sense's native Maximize Icon or Snapshot Icon


8. What's new?:

v1.1 16/02/2018:

Features:

  • Vizlib Filter now supports Alternate States

Bug Fixes:

  • Fixed IE11 compatability issues
  • Fixed some CSS styling issues in IE
  • Fixed an issue where the General Options property panel was sometimes hiding.

v1.0.1 12/02/2018:

Bug Fixes:

  • Fixed several tiny CSS bug fixes for Qlik Sense Desktop and for Qlik Sense Focus Theme.

v1.0.2 14/02/2018:

Bug Fixes:

  • DefaultValues was not properly supporting Variables.
  • Improved some inconsistencies in how one selected value was working

v1.0.1 12/02/2018:

Bug Fixes:

  • Fixed several tiny CSS bug fixes for Qlik Sense Desktop and for Qlik Sense Focus Theme.

v1.0 31/01/2018:

  • Initial Vizlib Filter release
  • Dropdown/Listbox/Buttongroup components
  • Responsive Qlik filter state design, which can be customised
  • One Selected Value & pre-defined selections
  • Rich formatting options

Coming Soon:

  • Alternate States
  • Added Styling Options
  • Cyclic Dimensions


9 Feedback and Bug Reporting

Feel free to raise your feedback or bugs found on the page below:
www.vizlib.com/feedback

Contact us:

support@vizlib.com

6 Terms & Conditions

Terms and Conditions
2018 © Vizlib Ltd. - All rights reserved.