How to set the browser time zone for Vega?

[pranay_jain]

I have a Vega visualization within Kibana. The vega part looks like this

{
  $schema: https://vega.github.io/schema/vega-lite/v5.json
  title: Event counts from all indexes

  data: {
    url: {
      %context%: true
      %timefield%: @timestamp
      index: commits
      
      body: {
        aggs: {
          time_buckets: {
            date_histogram: {
              field: @timestamp
              calendar_interval: day
              time_zone: "Asia/Calcutta"
            }
          }
        }
        size: 0
      }
    }
    format: {property: "aggregations.time_buckets.buckets"}
  }

  mark: line
  encoding: {
    x: {
      field: key
      type: temporal
      axis: {title: false}
    }
    y: {
      field: doc_count
      type: quantitative
      axis: {title: "Document count"}
    }
  }
}

As you see, I have hard-coded the time zone to Asia/Calcutta. Is there a way to set the time zone to the browser's time zone ?

[nickofthyme (Nick Partridge)]

Hey @pranay_jain :waze:,

To my understanding, we currently do not pass the time_zone context to vega, nor have any plans to do so. As such, this comment (see below ), would still apply.

Hi, unfortunately vega uses d3-time and d3-time-format to handle time scales and formatting. These libraries work only in local or UTC timezones.
We are not exposing the timezone to vega specs yet, so the only workarounds I can see are:

• configure Kibana in Browser timezone and open your browser with a specific timezone (on a mac for example you can just open the terminal and run

  TZ=Australia/Brisbane open https://your-kibana-domain:5601
  

• configure Kibana in Browser timezone and add a browser extension like https://mybrowseraddon.com/change-timezone.html to change manually from the browser the timezone (i've tested a bit the extensions linked and seems to work fine)
• change the spec of your vega visualization to handle the timezone offset shift manually. Since we are not exposing the timezone configuration to vega specs this workaround is quite complex and needs one visualization per timezone or a vega dropdown selector to select manually the timezone using the selection to change the UTC offset Binding a Parameter | Vega-Lite

See full list of context tokens here Vega | Kibana Guide [8.5] | Elastic