|
1. Overview 1.1 Function Introduction Drop-down List filtering, mainly used to filter some dimension data. 1.2 Application scenario For example, if you have sales data of several provinces and want to display the sales data of "Sichuan" and "Yunnan" in the province dimension by default when you open the dashboard, you can use the drop-down list filter. 2. Step 1)Create a new dashboard, add a bar chart, bind "Province", "Sales Volume". 2)Add a drop-down list filter component, drag and drop the drop-down list filter component from the component area to the canvas. 3)Bind data to the filter component, click to select the drop-down list filter component, drag and drop the "Province" column to the data binding area. 4)Edit the filter component with the following settings. a)Click Setting] on the right to set the layout: check "Drop-down List", set Row is "10" , Cloumn is "1" , and check the "Content Adaptation". that is, keep the default settings. b)Setting Options: Select "Multiple Selection", and check "Commit on Change", "Show All", "Top Selected Values ", "Ignore Null Value", that is, to maintain the default settings. On this basis, check "Default Value", and select "Customize" in the drop-down box below, and fill in "Zhejiang,Sichuan" in the input box. 6)When you preview or view dashboard, the default option in the drop-down list of provinces is "Sichuan; Zhejiang", and bar chart will only show the sales volume data of these two provinces. You can also filter other provinces, filter reference and display data as follows. Click More > Inverse on the toolbar at the upper-right corner of the province drop-down list component, select other provinces except "Sichuan; Zhejiang", the bar chart data will be changed to show the sales volumes data of other provinces. Click More > Clear on the toolbar at the upper-right corner of the Province drop-down list component to clear all the checked options, and then select "Hubei" and other provinces. 3. Function 3.1 Layout You can set the layout of the component through Setting > Layout on the right side, and the product provides two forms of display: list and drop-down list. By default, the product is displayed in the form of drop-down list. [Dropdown List]When selecting the drop-down list, the row will be displayed after the drop-down list, and the default drop-down list will be displayed in 10 rows, which can be set according to the user's needs, as shown in the following figure. Select drop-down list, the options will be displayed in the form of a drop-down list, click the drop-down arrow to expand the view options, you can set the row and column to be displayed. For example, set 10 rows and 2 columns to display provinces. Setting: Expand Before: After expanding: [Content Adaption] Default check "Content Adaption", when there are more options and the width of the selection box is narrower. The width of the drop-down list option box will adapt with the content of the options, and users can view the full name of all options for easy selection. Unchecked "Content Adaption", the content of the options can be displayed in 2 characters, and the part beyond the drop-down list option box will be displayed in... an omitted way. [Bottom Show Button] is not checked by default. After checking, the button will be displayed at the bottom of the drop-down options, and will no longer be displayed in the toolbar at the top right of the component. After checking options, you can click Clear to clear all the checkboxes, and click Apply button to filter according to the checkboxes. If you don't check Bottom Show Button, you can click Clear to clear all the checkboxes, and click Apply button to filter the results according to the checkboxes. ➢Note: The Apply button at the bottom needs to be unchecked before the Commit On Change button is displayed. [List] When list is selected, the options will be displayed in the form of a list, and you can set column to be displayed. For example, you can set 2 columns to display provinces, as shown below: 3.2 Option You can set the rules of the drop-down options through Setting > Option on the right side, as shown below. [Single Selection]After checking this option, only one data can be selected for filtering in the list filter, and the selection box on the list filter is a radio box. •Checked Checkbox style:  •Unchecked Checkbox style:  [Multi-Selection] When this option is checked, multiple data can be selected for filtering in the list filter, and the selection box on the list filter is a check box. •Checked Checkbox style:  If it is a child node, after checking the corresponding option, it is checked; If the node is a parent node, all the options of the child node need to be checked before the node is selected. If there is a null value and "Ignore Null Value" is not checked in the configuration, the null value in the child option needs to be checked before the parent node becomes selected. •Unchecked Checkbox Style:  If the option is not checked, the node is unchecked. •Half-Checked Checkbox style:  The parent node is half-selected when the child node has only some of the options selected. ➢Note: Only the parent node of the tree filter has a semi-check state. [Commit on Change] By default this option is checked, i.e. the filter function is executed immediately after checking. When this option is not checked, the Apply button will be displayed in the toolbar of the filter component, and the filter function will be executed only when this button is clicked after the data in the list filter is checked. [Show All] is checked by default. After checking, Select All will be added to the top of the drop-down options, checking Select All allows you to quickly select all the options in the drop-down list, which is usually used when there are more options. if you don't check "Show All" there is no "Show All" option. [Selection On Top]The selected value will be shown in the front when you click outside the component after selecting the option. It is checked by default. If it is not checked, when a value is selected, the selected value is still in the original position. [Ignore Null Value] Null values are ignored, i.e., they are not displayed. [Exclude] By default, this option is not checked. When Exclude is checked, the selected data is equivalent to the excluded data, and the exclusion line is displayed on the selected data. [Default] When checked, you can choose to set the first value on the data column bound on the component, or you can choose to customize the setting of the default value. Each time the dashboard is reopened, the default value set for the component's bound data column will be checked. The following table shows the customized default value settings and effects for different data types. Data Type Custom Default Value Setting Effect
Time You can enter the time data in the text box with the same format as in the dataset, or click time icon to select the corresponding time data in the time panel. After the setting is completed, the customized default value will be displayed in the text box, and the default value option in the drop-down list is checked.
Date You can input data in date format in the text box, or click the date icon to select the corresponding date data in the date selection panel. After the setting is completed, the customized default value will be displayed in the text box, and the default value option in the drop-down list is checked.
Timestamp You can enter data in the text box that matches the timestamp format, or click the date icon to select the corresponding date in the Date panel, and then click the Select Time button below to select the corresponding time. After the setting is completed, the customized default value will be displayed in the text box, and the default value option in the drop-down list is checked.
Text (character, string, byte, long, short, integer, float, double, bigDecimal) You can input data conforming to character, string, byte, long, short, integer, floating, double, bigDecimal in the text box. Multiple integers as in the figure. After setting, the text box will display the customized multiple default values, and the default value option in the drop-down list is checked status.
Boolean You can select True, False in the drop-down options. After the setting is complete, the customized default values are displayed in the text box and the Default Value option in the drop-down list is in the checked state.
➢Note: User Defined values are not supported for setting parameters for the time being. When the bound data is of text type, enter ? {parameter name} in the text box, the product will process it as normal text. If the bound data is other than text, the product will tip "Please enter a value". You can bind a date and time column and set the sorting method to descend: Check "Default -First Value", with the date of the dynamic update of the data, each time you open the dashboard to see the latest time data. [Required]] is not checked by default. When checked, the component is required. When there are multiple parameter components or filter components involved in filtering, the data can be filtered only if all the required components have selected values. ➢For Example： After checking "Required" for Market, selecting "Hide" for Visibility, and then selecting "Anhui" for Province, the Market will be empty, at this time, the "Required" for Market will be regarded as optional. Required" is regarded as non-required, and the data of Anhui province will be filtered out. Check "Required" for Market, select "Hide" for visibility, set "Batch Commit" for commit button, select "Anhui, Fujian" for Province, Click Commit button, the hidden Market will not participate in the batch commit verification, and the data of Anhui and Fujian Province will be filtered out. [Unselected Value Tip] The layout is dropdown list, when the value is not selected, the user can customize the tip, the default is "Please select...". ➢Note: The product supports from V9.4 version, when options are more than 5, if the layout mode is Drop-down List, the search box will be displayed auto, and you can enter text to search. When the layout is list, search function is also supported, but there is no search box by default, you can click the button above the component to show the search box. 3.3 Format
| 
