Vizlib Home

Vizlib Calendar Properties - Dimensions and Settings


The Vizlib Calendar supports one date dimension which needs to have the $timestamp metadata tag assigned to it by the Qlik Sense data model. The Vizlib Calendar Wizard will support you in building the component, by providing you with a list of available date dimensions. The Vizlib Calendar does not support Measures, yet. This is a feature expected to be introduced in the near future. 

The format below should not contain something like =[Invoice Date], please do not use = sign or brackets [ ]


The Settings section covers properties and settings which control the main behavior and look and feel of the Vizlib Calendar.

  • Settings

Choose between advanced and basic settings mode. The advanced mode will allow you to see all available settings whereas the basic mode only displays a subset of those, for a more user-friendly configuration.

  • Selection Bar

If the display view is collapsed - you can enable the selection bar and choose its position on top or bottom of the calendar object.

  • Date Picker

This setting allows you to choose between a single date picker (to select one single date at a time) or a date range picker (to select ranges of dates).

single data picker example:
data range picker example:

  • Display View

Either collapse the calendar object to only display when the user clicks on the input box (saves real estate) or show the calendar expanded in full view.

  • Placeholder Text

If no selections are made in the date field, the placeholder text will be displayed in the input box.

  • Calendar Label

Show/Hide the calendar label. 

You can modify the label name.

  • Label Color

Choose the Label Color using color picker or standard Qlik Sense Expression.

  • Font Size

Set the font size using slider or by expression.

  • Label Font Style

Choose the label font style.

  • Label Position

Choose the position of the calendar Label: Inline/ Top/ Bottom

  • Label Orientation

Choose between left and right label orientation.

  • Background

Choose the background color of the calendar placeholder.

  • Font Color

Define the font color.

  • Border

Enable borders.

  • Border Color

Choose the border color.

  • Border Thickness

Set the width of the border line.

  • Border Radius

Determine the border radius.

styling examples:

  • Input width
    Modify the width size of the input box by either defining a width size or setting fixed mode.

input width styling example:

Vizlib is the author of this solution article.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.