Add time zone support

[tchan]

I've forked a pen from https://codepen.io/adrianhurt/pen/GqvBzo?editors=1010 in which the x axis displays as intended.

Here is my fork https://codepen.io/travismchan/pen/VMromR
The x axis displays but the data is not aligned correctly, if you hover over the first data point after Jan 16th, it will display a value from January 15. And even then, the January 15th values seem to be shifted too much to the right, the Jan 15th 12:00 is not in the center of the tick from Jan 15-Jan 16 which is expected.

Context

I have a chartjs project that involves dynamic data where you can adjust the start and end dates. When the start and end dates span more than a year, the alignment is off as well. The giant bar after the October tick is from September. Another pain point is that it throws in "Nov 2017" squished in there which sometimes overlaps the second last tick.

Edit: I think the squishing of nov 2017 is related to #3051

Environment

• Chart.js version:2.7.0 (latest)
• Browser name and version: Chrome
• Link to your project: https://codepen.io/travismchan/pen/VMromR

Any advice is appreciated.

[etimberg]

@benmccann @simonbrunel any thoughts on this? Looks like the bars aren't put in the right spot

[benmccann]

There are multiple issues here. If I change it from a bar graph to a line graph then it's less wrong (https://codepen.io/anon/pen/vedwBq). I'm filing a second issue to track the bar chart plotting: #4825

[etimberg]

I wonder if this is a timezone issue. The times are in UTC (+0000) but I'm not there. If I change the times to UTC-5, stuff lines up https://codepen.io/anon/pen/MEQaqw

[benmccann]

I actually think that the ticks and data points are being plotted in the correct places relative to each other. The issue is that the formatting for the data point hover over is in UTC and the formatting of the ticks is in local time. We should use a consistent formatter

We should add time zone option that let's the user specify which timezone they'd like to use. This is most noticeable in the formatting used. However, it also has an effect beyond that. E.g. when we're calculating auto-ticks we try to align to the start of a minute, day, hour, etc. But when the start of the day is depends on what time zone you're in. Perhaps the default time zone could be auto-detected. E.g. in this case we might be able to determine that the user is specifying the labels as +0000

[benmccann]

I've created issue #5186 to consolidate the various pieces of feedback we've received regarding time zone support. I'm going to close this issue in favor of that one. Please feel free to subscribe to it for updates