# Apply and delete filters

### **Applying filters**

There are two ways in which you can apply filters to a Vizpad:

1. Local Filter (filters applied to a Viz)
2. Global filters (filters applied to all the Viz in a Vizpad)

#### **Local filter**

To apply a local filter, the following fields need to be provided:

1. **actionType**: vizFilter
2. **vizID:** ID of the Viz
3. **column:** column name for which the filter is to be applied
4. **value:** value to be applied
5. **operator:** operator to be applied

When the following code is applied, the filter *"Sales >= 10000"* will be applied to the individual Viz (of ID "vizID\_for\_local\_filter) of a Vizpad.

```javascript
telliusFrame.postMessage ({
    actionType: "vizFilter",
        filters: [{
            vizId: "vizID_for_local_filter",
            value: "10000",
           column: "Sales",
            operator: ">="
        }]
    }, "*");
```

#### **Global filter**

To apply a global filter at the tab level, the following fields need to be provided:

1. **actionType:** vizpadFilter
2. **column:** column name for which the filter is to be applied
3. **value:** value to be applied
4. **operator:** operator to be applied
5. **allTabs:** If set to `true`, then the filters will be applied for all the tabs in a Vizpad. If set to `false`, then the filters will be applied only to the currently active tab.

When the following code is applied, the filter *"Ship\_Mode does not contain 'same'"* will be applied to all the Viz present in the current tab (since **allTabs** is set to `false`) of a Vizpad.

```javascript
telliusFrame.postMessage ({
    actionType: "vizpadFilter",
        filters: [{
            value: "Same",
            column: "Ship_Mode",
            operator: "Does not contain"
        }],
    allTabs: false
    }, "*");
```

### **Supported filters**

The following are the types of filters supported in a Vizpad:

* Operators
* Timeline filters
* Resolution filters

#### **Operators**

* < (less than)
* <= (less than or equal to)
* \> (greater than)&#x20;
* \>= (greater than or equal to)
* \= (equal to)
* != (not equal to)
* \>= & <= (between)
* in
* not in
* like (contains, starts with, ends with)
* not like (does not contain, does not start with)

{% hint style="info" %}
When **like** operator is used, you can use the value *contains* or *starts with* or *ends with* for the `conditionName` field as required. If no `conditionName` field is mentioned, it will be considered as *contains*.
{% endhint %}

Here is a sample code for **like** operator that uses **conditionName** field.

```javascript
telliusFrame.postMessage({
                actionType: "vizFilter",
                    filters: [{
                        vizId: "ID_of_Viz",
                        value: "New",
                        column: "store_state",
                        operator: "like",
                        conditionName: "starts with" 
                    }]
                }, "*");
```

{% hint style="info" %}
Two filters are required to support the **between** operator.
{% endhint %}

Here is a sample code for using **between** operator:

```javascript
telliusFrame.postMessage({
    actionType: "vizFilter",
        filters: [{
            vizId: "ID_of_Viz",
            value: "900",
            column: "Shipping_Cost",
            operator: ">=",
        }, {
            vizId: "ID_of_Viz",
            value: "1200",
            column: "Shipping_Cost",
            operator: "<="
        }]
    }, "*");
```

#### **Timeline filters**

The following operators are supported for timeline filters

* Today
* Yesterday
* Last 5 days
* Last 7 days
* Last 15 days
* Last 30 days
* Last week
* Last month
* This month
* Last 3 months
* Last 6 months
* This year
* Last year
* Last 3 years
* Last 6 years
* Custom range (user-defined time period)

Here is a sample code for applying custom time range:

```javascript
telliusFrame.postMessage ({
    actionType: "vizFilter",
        filters: [{
            value: {
                start: "2014-02-18T00:00:00Z",
                end: "2018-02-18T00:00:00Z"
            },
            column: "Ship_Date",
            filterKind: "vizTimelineFilter",
            vizId: "ID_of_Viz",
        }]
    }, "*");
```

#### **Resolution filters**

The following operators are supported for the resolution filter:

* Hourly
* Daily
* Weekly
* Monthly
* Quarterly
* Yearly

Here is a sample code for applying the resolution filter:

```javascript
telliusFrame.postMessage({
    actionType: "resolution",
    timeColumn: {
        resolution: "quarterly",
    }
}, "*");
```

### **Removing filters**

To remove a filter (local or global), the following fields need to be provided:

1. **actionType:** remove all filters or a specific filter from a Viz/Vizpad
2. **Id:** ID of the filter
3. **vizID:** ID of the Viz (if required)

The following are some of the code samples on removing filters in different ways:

1. To remove all filters applied to a Vizpad

```javascript
telliusFrame.postMessage({
actionType: "removeAllVizFilter"
}, "*");
```

2. To remove a specific filter applied to a Vizpad (removes the specific filter from all the Viz and all the tabs)

```javascript
telliusFrame.postMessage({
    actionType: "removeVizpadFilter",
    id: "advancedFilter_idD_5j7kiov0e",
}, "*");
```

3. To remove a specific filter applied to a Viz

```javascript
telliusFrame.postMessage({
actionType: "removeVizFilter",
vizId: "f086db5c-e824-4bce-a1ec-07d005d8196f",
id: "advancedFilter_idD_maqkb30lh",
}, "*");
```
