Date Selector A Powerful Tool for Action Triggering

Introduction

A date selector is a type of element that allows users to choose a specific date, triggering actions based on their selection. This versatile tool can be added to the header and sidebar in the desktop view, as well as to the drawer in the mobile view. By adding a date selector to your dashboard, you can enhance the user experience and provide them with the ability to filter data based on specific dates.

Adding a Date Selector

Before adding a date selector, it is important to have a header or sidebar in your desktop view, or a drawer in your mobile view. Once you have the necessary structure in place, follow these steps to add a date selector:

1. Click the “View” button on the dashboard toolbar to open the View pane.
2. For the desktop view, click either the “Header” or “Sidebar” tab in the View pane.
3. Click “Add selector” to begin configuring your date selector.
4. Choose a selector type and start customizing it according to your requirements.

For the mobile view, follow these steps:

1. Click the “Drawer” tab in the View pane.
2. Click “Add selector” to configure a new date selector.
3. Alternatively, you can copy a date selector configured in the desktop view by clicking “Copy selector.” Note that actions will need to be configured again for the mobile view.

Configuring a Date Selector

Once you have added a date selector, you can further customize its properties and actions. Here’s how you can configure a date selector:

1. On the Selector tab, specify properties specific to the date selector type, such as its display style.
2. On the Actions tab, define the actions that will be triggered by the date selector.
3. Depending on where the date selector is added, you can choose from different presentation modes, such as Inline, Dropdown, or Accordion.
4. For selectors added to the drawer in the mobile view, the drop-down mode is the default presentation style.
5. On the desktop view, the amount of space occupied by selectors may vary based on their configuration. Some presentation modes and display types may not be suitable for the header due to its fixed height. In such cases, consider adding the date selector to the sidebar or choosing a different configuration.
6. Optionally, you can include an icon next to the date selector label to enhance its visual appeal.

To modify the settings of an existing date selector, simply hover over it and click the “Configure element” button. You can also rearrange the order of selectors in the sidebar or header by using the “Move” buttons.

Category Selector: A Powerful Filtering Mechanism

A category selector is another type of selector that allows users to choose from predefined categories, features, or summary statistics. It can be used to apply spatial filters when categories are derived from features. Here’s how you can make the most of a category selector:

1. Choose between the Inline, Accordion, or Dropdown presentation modes based on your requirements.
2. The Inline presentation mode allows you to display categories as a list or a button bar.
3. The Accordion and Dropdown modes display categories as a list.
4. Adjust the Selection setting to enable users to select a single category or multiple categories simultaneously.
5. To enable single category selection, toggle the “None” option button, which adds a “None” category to the selector, allowing users to have no selection.
6. Enable the “Show search” toggle button to allow users to search the list of categories for easier selection.
7. When multiple selections are enabled, users can click the “Show selected” button next to the search bar to filter the category list and display only the selected categories.
8. If your selector is based on grouped values, the categories are automatically generated based on the field names in your data.
9. You can customize the display labels for categories on the Data tab by clicking “+Override” and entering the desired category label.
10. Additionally, you can click “Load categories” to add all categories at once and modify their labels.

Number Selector: Powerful Filtering Based on Numeric Values

A number selector allows users to choose a specific numeric value or range, enabling powerful filtering capabilities. Here’s how you can configure a number selector:

1. Choose between a single fixed value or a numeric range as the basis for your number selector.
2. Provide users with the option to select values using a number spinner, slider, or a combination of both.
3. When both options are available, users can input values using either the number spinner or the slider.
4. When configuring the spinner display type, consider including value limits and specifying the increments for the spinner values using the Increments option.
5. For the slider display type, a minimum and maximum value must be defined.
6. Use the Precision option to specify the number of decimal points for the slider’s values, if necessary.

Conclusion

In conclusion, a date selector is a valuable tool that allows users to choose specific dates and trigger actions accordingly. By following the steps outlined in this guide, you can easily add and configure a date selector in your dashboard. Additionally, the category selector and number selector provide powerful filtering options based on predefined categories or numeric values. By leveraging these selectors, you can enhance the functionality and usability of your dashboard. So go ahead and start incorporating date selectors into your dashboard to provide a seamless user experience and enable effective data filtering.