JSON code for filters in Custom Apps
GIS Cloud filters are used to filter data in a map and attribute table based on feature 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.
There are multiple ways to add filters to a custom app – by adding a filter builder or by adding filters directly through the app builder. If you’re sharing your map publicly or with clients, you might prefer adding the filters directly through the App builder so that the end user doesn’t see the Filter builder button on the top menu ribbon.
Filter items can also be added directly to the app.json configuration file. A filter can be found in the app.json file in the section pertaining to the panel where the filter is set up:
{
"id": "panel2",
"title": "Filters",
"width": 400,
"height": 400,
"open": false,
"closeButton": true,
"css": {
"top": "150px"
},
"filters": [{
"YOUR_MAP_ID": [{
"layer_id": "YOUR_LAYER_ID",
"items": [{
"type": "DATA_FILTER_RANGE",
"column": "magnitude",
"label": "magnitude",
"step": "",
"autofetch": true,
"relevantValues": true
},
Below you can find examples of JSON code for each of the GIS Cloud filters. Note that some elements will need to be changed, for example, the layer IDs in the Filters sections. An example custom app JSON can be found here.
Input filter
{
"type": "DATA_FILTER_INPUT",
"column": "depth",
"label": "Depth"
}
Autocomplete filter
{
"type": "DATA_FILTER_AUTOCOMPLETE",
"column": "name",
"label": "Name",
"relevantValues": true
}
Min-Max filter
{
"type": "DATA_FILTER_MINMAX",
"column": "magnitude",
"label": "Earthquake Magnitude",
"autofetch": true,
"relevantValues": false
}
Range filter
{
"type": "DATA_FILTER_RANGE",
"column": "magnitude",
"label": "Earthquake Magnitude",
"step": "",
"autofetch": true,
"relevantValues": true
}
Dropdown filter
{
"type": "DATA_FILTER_DROPDOWN",
"column": "status",
"label": "Status",
"no_filter": "",
"multiselect": false,
"autofetch": true,
"relevantValues": true
}
Date filter
{
"type": "DATA_FILTER_DATETIME",
"column": "date_time",
"label": "date_time",
"operator": "after"
}
Note: possible operators for the date and time filter are: “after”, “before”, “onorafter”, “onorbefore”.
Slider filter
{
"type": "DATA_FILTER_SLIDER",
"column": "magnitude",
"label": "magnitude",
"step": "",
"autofetch": true,
"relevantValues": false
}
Features number filter
{
"type": "DATA_FILTER_FEATURES_NUMBER"
}