# Time filter

**URL:** <https://discuss.elastic.co/t/time-filter/359021>\
**Category:** Kibana\
**Tags:** vega\
**Created:** [May 8, 2024, 7:06am UTC](https://discuss.elastic.co/t/time-filter/359021 "2024-05-08T07:06:29Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![tonichu](https://avatars.discourse-cdn.com/v4/letter/t/eada6e/32.png) [@tonichu](https://discuss.elastic.co/u/tonichu)\
**Post date:** [May 8, 2024, 7:06am UTC](https://discuss.elastic.co/t/time-filter/359021/1 "2024-05-08T07:06:29Z")

</div>

I have a kibana graph made with vega that shows in a line graph some metrics over time and I want to be able to filter by time but the selector does not work for me.

---

<div class="post-metadata">

**Author:** ![Marco\_Liberati](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/marco_liberati/32/82953_2.png) [@Marco\_Liberati](https://discuss.elastic.co/u/Marco_Liberati)\
**Post date:** [May 8, 2024, 8:21am UTC](https://discuss.elastic.co/t/time-filter/359021/2 "2024-05-08T08:21:56Z")

</div>

Hi @tonichu ,

does your Vega spec contains the following arguments?

```auto
// Apply dashboard context filters when set
%context%: true
// Filter the time picker (upper right corner) with this field
%timefield%: @timestamp

```

---

<div class="post-metadata">

**Author:** ![tonichu](https://avatars.discourse-cdn.com/v4/letter/t/eada6e/32.png) [@tonichu](https://discuss.elastic.co/u/tonichu)\
**Post date:** [May 28, 2024, 7:16am UTC](https://discuss.elastic.co/t/time-filter/359021/3 "2024-05-28T07:16:41Z")

</div>

noup

---

<div class="post-metadata">

**Author:** ![tonichu](https://avatars.discourse-cdn.com/v4/letter/t/eada6e/32.png) [@tonichu](https://discuss.elastic.co/u/tonichu)\
**Post date:** [May 28, 2024, 7:58am UTC](https://discuss.elastic.co/t/time-filter/359021/4 "2024-05-28T07:58:21Z")

</div>

this is my grafh and i try with your request but does not work.  
///  
{  
"$schema": ".../schema/vega-lite/v4.json",  
"title": "Registros por zona en el tiempo",  
%context%: true,  
%timefield%: @timestamp,  
"data": {  
"name": "source",  
"url": {  
"index": "wifi",  
"body": {  
"size": 20,  
"query": {  
"match\_all": {}  
},  
"\_source": ["api\_response.result.values"]  
}  
},  
"format": {  
"property": "hits.hits"  
}  
},  
"params": [  
{  
"name": "interpolate",  
"select": {"type": "point", "fields": ["metric"]},  
"value":"bandwidth",  
"bind": {"input": "select", "options": ["nodes", "connections", "bandwidth"]}  
},{  
"name": "grid",  
"select": "interval",  
"bind": "scales"  
},  
{  
"name": "fechaInicio",  
"value": "2000-04-15",  
"bind": {"input": "date", "name": "Fecha de inicio"}  
},  
{  
"name": "horaInicio",  
"value": "00:00",  
"bind": {"input": "time", "name": "Hora de inicio"}  
},  
{  
"name": "fechaFin",  
"value":"2024-04-15",  
"bind": {"input": "date", "name": "Fecha de fin"},  
},  
{  
"name": HoraFin",  
"value":"00:10",  
"bind": {"input": "time", "name": "Hora de fin"}  
}

],  
"transform": [  
{  
"flatten": ["\_source.api\_response.result.values"],  
"as": ["flattened\_values"]  
},  
{  
calculate: toDate(datum.flattened\_values[0])  
as: timestamp  
},  
{  
"calculate": "datum.flattened\_values[1]",  
as: "uid"  
},  
{  
"calculate": "datum.flattened\_values[4]",  
as: "typemeter"  
},  
{  
"calculate": "datum.flattened\_values[5]",  
as: "alias"  
},  
{  
"calculate": "datum.flattened\_values[6]",  
as: "lat"  
},  
{  
"calculate": "datum.flattened\_values[7]",  
as: "lon"  
},  
{  
"calculate": "datum.flattened\_values[8]",  
as: "cota"  
},  
{  
"calculate": "datum.flattened\_values[9]",  
as: "description"  
},  
{  
"calculate": "datum.flattened\_values[10]"  
as: "description\_origin",  
}  
{  
"calculate": "datum.flattened\_values[11]",  
as: "name"  
}  
{  
"calculate": "datum.flattened\_values[12]",  
as: "organizationid"  
}  
{  
"calculate": "datum.flattened\_values[13]",  
"as": "origin"  
},  
{  
"calculate": "datum.flattened\_values[2]",  
"as": "value"  
},  
{  
"calculate": "datum.flattened\_values[3]",  
"as": "metric"  
},  
{  
"timeUnit": "utcyearmonthdatehoursminutesseconds",  
"field": "timestamp",  
"as": "timestamp"  
},

```
 {
 
   "filter": {
      "and": [{"param": "interpolate", "equals": "datum.metric"},

```

{"param": "fechaInicio", "equals": "timestamp"}  
]

```
},
}

```

{  
"joinaggregate": [

```
    {"op": "average", "field": "value", "as": "averageValue"}
  ],
  "groupby": ["timestamp", "origin"]
}

```

],  
"mark": "line",  
"encoding": {  
"x": {  
"field": "timestamp",  
"timeUnit": "utcyearmonthdatehoursminutesseconds",  
"title": "Timestamp",  
"axis": { "labelAngle": 15 }  
},  
"y": {  
"field": "averageValue",  
"type": "quantitative",  
"title": ""  
},  
"color": {  
"field": "origin",  
"type": "nominal",  
"title": "Folder",

```
},"tooltip": [
{"field": "timestamp", "type": "temporal", "title": "Tiempo"},
  {"field": "uid", "type": "nominal", "title": "uid"},
   {"field": "metric", "type": "nominal", "title": "metric"},
       {"field": "typemeter", "type": "nominal", "title": "typemeter"},
           {"field": "alias", "type": "nominal", "title": "alias"},
               {"field": "lat", "type": "nominal", "title": "lat"},
                   {"field": "lon", "type": "nominal", "title": "lon"},
                       {"field": "cota", "type": "nominal", "title": "cota"},
                           {"field": "description", "type": "nominal", "title": "description"},
                               {"field": "name", "type": "nominal", "title": "name"},
                               
                                   {"field": "organizationid", "type": "nominal", "title": "organizationid"},
{"field": "origin", "type": "nominal", "title": "origin"},
{"field": "averageValue", "type": "quantitative", "title": "Valor Promedio"}

```

]  
}  
}  
///