Display Time Range in Vega Text

Elastic Stack Kibana
1

Hello,
I’m trying to add text to my vega visualization that displays the selected Time Range. I started with what’s shown below, which gives the current time but I quickly reached a dead-end. Is there a built in signal that accesses the min and max timefilter?

Thanks,
Butch


{
  "$schema": "https://vega.github.io/schema/vega/v3.json",
  "title": "Last refreshed",
  "data": {
    "url": {
      "%context%": true,
      "%timefield%": "@timestamp",
      "index": "_all",
      "body": {
        "size": 0
      }
    }
  },
  "marks": [
    {
      "type": "text",
      "encode": {
        "enter": {
          "fill": {"value": "#000"},
          "fontSize": {"value": "30"},
          "text": {"signal": "timeFormat(now(), '%Y-%m-%dT%H:%M:%S')"}
        },
        "update": {"x": {"value": "0"}, "y": {"value": "0"}}
      }
    }
  ]
}
2

Unfortunately there is no built-in signal like that (but that sounds like a good idea to implement it -- please create a ticket in https://github.com/elastic/kibana ) The only thing that Kibana Vega has is the ability to filter data based on the current timefilter.

As a possible workaround that I am not sure would work: in theory there might be a way to create an ElasticSearch query in such a way so it returns the same value as passed in, thus returning the current timefilter. Just a thought that I never really explored.

3

Yuri is correct, you can use Elasticsearch to accomplish what you are trying to do here. Simply create a data call like so:

{"name": "timegrabber", "url": {"index": "<>", "%context%": true, "%timefield%": "<< insert time field name>>", "body": {"aggs": {"time_buckets": {"date_histogram": {"field": "<>", "interval": {"%autointerval%": true}, "extended_bounds": {"min": {"%timefilter%": "min"}, "max": {"%timefilter%": "max"}}, "min_doc_count": 0}}}, "size": 0}}, "format": {"property": "aggregations.time_buckets.buckets"}, "transform": [{"type": "aggregate", "fields": ["key_as_string", "key_as_string"], "ops": ["min", "max"], "as": ["min", "max"]}]}

Alternatively you could call key instead which will be the time in UNIX time. After this, you need to just call your min and max as appropriate to show that in a text call. You should add a time filter too to display in proper format if using the key (in UNIX time) like "text": {"signal": "utcFormat(datum.min, '%x %X')"}.

Once done, all you need to do is add a from to the timegrabber data call and call the datum.min and datum.max respectively.

Please let me know if that works for you!

4

Awesome! That worked! Thank you both for your help.

Also, I created ticket #56743 "Create Vega signal that accesses the min and max timefilter" as requested.

Thanks again,
Butch

5

Midas -

Could you explain what you mean by "you could call key instead"? I just realized that @timestamp is a string value which I'm having problems formatting into something a little easier to read. I'm pretty sure you gave me the answer in your last paragraph but I'm not tracking.

Thanks,
Butch

6

Sure, instead of calling key_as_string in the aggregate transform, use the "key" in the "fields": section. This will call the time as a UNIX timestamp instead of a string. So basically do this instead:

{"name": "timegrabber", "url": {"index": "<>", "%context%": true, "%timefield%": "<< insert time field name>>", "body": {"aggs": {"time_buckets": {"date_histogram": {"field": "<>", "interval": {"%autointerval%": true}, "extended_bounds": {"min": {"%timefilter%": "min"}, "max": {"%timefilter%": "max"}}, "min_doc_count": 0}}}, "size": 0}}, "format": {"property": "aggregations.time_buckets.buckets"}, "transform": [{"type": "aggregate", "fields": ["key", "key"], "ops": ["min", "max"], "as": ["min", "max"]}]}

Hope that helps!

7

Yes, I understand now.

Thanks for your time,
Butch

8

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.