Skip to content Skip to main navigation Skip to footer

How to set up filters in custom apps?

GIS Cloud filters are used to filter data in a map and attribute table based on features attributes. It is possible to set filters for multiple layers within the same map. It is also possible to set filters for more maps within the custom app. 

Note: Filters are only available for custom apps! If you’re interested in learning more, feel free to contact our consultants at sales@giscloud.com

Add filters to a custom app

1. Open the Manager app and login with your GIS Cloud credentials.

2. Go under the Apps tab and click the Edit button for the desired app.

3. Go under the Advanced tab and click the Create/Open app folder.

4. Create a new app.json file or open the existing one.

5. If a new app.json file is created, paste this code:

{
"responsive": true,
"scripts": {
"setup": []
},
"sections": {
"top": {
"menu": {
"items": [{
"label_i18n": "Filters",
"href": "javascript:;",
"onclick": "giscloud.app.panels[0].toggle();"
}, {
"label_i18n": "Filter builder",
"href": "javascript:;",
"adminCheck": true,
"onclick": "new giscloud.ui.FilterBuilderManager()"
}]
}
}
}
}

6. If you already have the app.json file set with some custom buttons, paste only code below. It should be in the 9th row, between “items”: [ and {

{
"label_i18n": "Filters",
"href": "javascript:;",
"onclick": "giscloud.app.panels[0].toggle();"
},
{
"label_i18n": "Filter builder",
"href": "javascript:;",
"adminCheck": true,
"onclick": "new giscloud.ui.FilterBuilderManager()"
},

7. Click Save&Close

8. Refresh Map Portal and it should have two additional buttons: Filters and Filter Builder.

Note: Only the app owner can see the Filter builder button after login.

Adding filters

Here you can find instructions on how to add filters. After clicking the Filter builder button on the Map preview ribbon:

  1. Open the Filter builder button.
  2. Choose the layer.
  3. Select the filter type.
  4. Select the layer column.
  5. Add the label which will be displayed and additional options.
  6. Click Apply.
  7. Click Save&Close.
  8. Click the Filters button to view filters.

List of available filters

  1. Input filter – search exact value within the selected column. This filter is case sensitive.
  2. Autocomplete filter – populates entered values. Display only relevant values – if some other filter is applied, this option filters values from already filtered rows.

  3. Min/Max filter – filter for numbers. Searches features between the minimum value and the value written in the box. This filter works only with Integer and Real column type. Autofetch option automatically calculates the minimum and maximum value.

  4. Range filter – filters values in a range between min and max value. Step value option defines difference value between two classes. Autofetch option automatically calculates minimum and maximum value.

  5. Dropdown filter – values can be selected from the drop-down menu. When the Multiselect option is checked, it is possible to select more values from the dropdown list. You can manually add values in the drop-down list or check Autofetch to add all values within a column in this filter automatically.

  6. Date filter – searches features based on Date and Time. This feature works only for Timestamp column type. You can choose between Before and After operators. Before operator filters dates before the selected date and after filters dates after the date selected in the filter.

  7. Slider filter – features can be filtered using a slider. Step value option defines the difference value between the two classes.
  8. Features number filter – shows the number of selected features.

Was This Article Helpful?