# Current Time Marker in vega-lite chart

**URL:** https://discuss.elastic.co/t/current-time-marker-in-vega-lite-chart/256073
**Category:** Kibana
**Created:** [November 20, 2020, 7:46am UTC](https://discuss.elastic.co/t/current-time-marker-in-vega-lite-chart/256073 "2020-11-20T07:46:14Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![shin1](https://avatars.discourse-cdn.com/v4/letter/s/51bf81/32.png) [@shin1](https://discuss.elastic.co/u/shin1)
#### Post date: [November 20, 2020, 7:46am UTC](https://discuss.elastic.co/t/current-time-marker-in-vega-lite-chart/256073/1 "2020-11-20T07:46:14Z")

</div>

Hi experts,

Is there any way to draw a current time marker in vega-lite?  
I'd like to do it on a scatter plot written in vega-lite.

Many thanks in advane,

Cheers  
Shin

---

<div class="post-metadata">

### Author: ![jsanz](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/jsanz/32/53734_2.png) [@jsanz](https://discuss.elastic.co/u/jsanz)
#### Post date: [December 7, 2020, 3:37pm UTC](https://discuss.elastic.co/t/current-time-marker-in-vega-lite-chart/256073/2 "2020-12-07T15:37:53Z")

</div>

Looks like you want a [`Rule`](https://vega.github.io/vega-lite/docs/rule.html) mark. Using the default vega example, moved the data and encoding into a layer and created another one that renders a vertical rule based on a transform that computes the current timestamp.

This should give you a starting point

```auto
{
  $schema: https://vega.github.io/schema/vega-lite/v4.json
  title: Event counts from all indexes
  layer: [
    // Original layer
    {
      data: {
        url: {
          %context%: true
          %timefield%: @timestamp
          index: _all
          body: {
            aggs: {
              time_buckets: {
                date_histogram: {
                  field: @timestamp
                  interval: {%autointerval%: true}
                  extended_bounds: {
                    min: {%timefilter%: "min"}
                    max: {%timefilter%: "max"}
                  }
                  min_doc_count: 0
                }
              }
            }
            size: 0
          }
        }
        format: {property: "aggregations.time_buckets.buckets"}
      }
      mark: line
      encoding: {
        x: {
          field: key
          type: temporal
          axis: {title: false} // Customize X axis format
        }
        y: {
          field: doc_count
          type: quantitative
          axis: {title: "Document count"}
        }
      }
    }
    // Rule marking the current timestamp
    {
      // Dummy data
      data: {
        values: {
          foo: "bar"
        }
      }
      /* We want to generate a new 
         field value with the current
         timestamp */
      transform: [
        {
          calculate: "now()"
          as: now_field
        }
      ]
      /* Draw a rule using the
         now_field on the X axis */
      mark: rule
      encoding: {
        x: {
          type: temporal
          field: now_field
          axis: {title: false} // Customize X axis format
        }
        color:{
          value: red
        }
        size: {
          value: 2
        }
      }
    }
  ]
}

```

 ![image](https://us1.discourse-cdn.com/elastic/original/3X/c/0/c014176b301a18360a498e48034dccb0599fe2e6.png)

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)
#### Post date: [January 4, 2021, 3:37pm UTC](https://discuss.elastic.co/t/current-time-marker-in-vega-lite-chart/256073/3 "2021-01-04T15:37:55Z")

</div>

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