CODEWITHSUNDEEP
angularjshighchartshighcharts-ng
mao
mao

Reputation: 1077

dynamically apply timezone offset to a highchart

I have a chart which ultimately I'd like to apply timezone offsets to from a dropdown list of timezones. The incoming times from json will all be UTC.

Is there a way to let highcharts handle the offset with the global timezoneOffset property, something along the lines of this when a button is clicked or dropdown selected:

Highcharts.setOptions({
  global : {
    timezoneOffset : 300
  }
});

Maybe I also need to redraw the chart after doing this?

Example here: https://plnkr.co/edit/oqOAmUnH2LZzAX3a7vpV

Upvotes: 1

Views: 1990

Answers (1)

Halvor Holsten Strand
Halvor Holsten Strand

Reputation: 20536

The global.timezoneOffset option is deprecated so I suggest using time.timezoneOffset instead for a chart. With the chart-sentric option you can do a normal chart update to set a new timezoneOffset.

For example (JSFiddle demo):

let chart = Highcharts.chart('container', {
  time: {
    timezoneOffset: -120
  }
  // ...
});

And upon doing a dropdown selection:

chart.update({
  time: {
    timezoneOffset: 0
  }
});

Upvotes: 2

Related Questions