Multi tool use

Highcharts v4.0.4 plotting local timezone

I am plotting UTC timestamps for an particular user whose timezone I know. Each data point is in the format "2018-06-19 13:19:52.000Z" and was added to the series of points to be plotted as moment("2018-06-19 13:19:52.000Z").tz(this.tiemZone).valueOf().

"2018-06-19 13:19:52.000Z"

moment("2018-06-19 13:19:52.000Z").tz(this.tiemZone).valueOf()

When the point is plotted, it is plotted as 6/19 13:19:52, but I would like this to be plotted in the user's timezone, so something like 6/19 6:19:52.

6/19 13:19:52

6/19 6:19:52

I read that Highcharts plots in UTC, but that if I set useUTC: false (somewhere), that it would plot in the current browser's timezone, but I actually want to plot in the user's timezone, e.g. if the timezone is "Los Angeles", then the above time would be 6:19:52.

useUTC: false

6:19:52

time = new window.Highcharts.setOptions({
time: {
timezone: _that.timeZone,
timezoneOffset: _that.offset
}
}, this);

return '<b>' + this.series.name + '</b><br/>' +
Highcharts.dateFormat('%m/%d %H:%M:%S',
this.x)
+ ' - ' + Highcharts.numberFormat(this.y, 2) + ' ' + toolTipUnits;


The offset I calculated after taking the moment of one of the UTC timestamps:

moment(data[0][0]).tz(this.timeZone)._offset, here is was equal to -420

moment(data[0][0]).tz(this.timeZone)._offset

-420

I tried something the above, but the tooltip still shows the UTC time 13:19:52. Any advice?

13:19:52

************************ UPDATE*****************************

time = new Highcharts.setOptions({
global: {
timezone: _that.timeZone,
timezoneOffset: _that.offset
}
}, this);

return '<b>' + this.series.name + '</b><br/>' +
Highcharts.dateFormat('%m/%d %H:%M:%S', this.x)
+ ' - ' + window.Highcharts.numberFormat(this.y, 2) + ' ' + toolTipUnits;


I updated the code as shown above, and now the data point is being plotted as 6/19 20:19:52, even though I am adding -420 to the data point (this.x). Looking into this, but any idea why?

6/19 20:19:52

-420

this.x

1 Answer
1

It looks to me like you're simply going in the opposite direction.

From the Highcharts API documentation, it says "positive values are west, negative values are east of UTC." If you assume 6/19 13:19:52 is UTC time, and you want 6/19 6:19:52 (seven hours west of UTC), then you'll want to set a positive number for your offset (timezoneOffset: 420). What you're doing now is setting a negative number (-420), so it's returning an offset for seven hours east of UTC.

6/19 13:19:52

6/19 6:19:52

timezoneOffset: 420

-420

https://api.highcharts.com/highcharts/time.timezoneOffset

I hope this is helpful for you.

(Also, can I assume that in your return code, you're using this in the tooltip formatter?)

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.