Commit | Line | Data |
---|---|---|
4c765ad9 JPB |
1 | <!DOCTYPE html> |
2 | <html> | |
3 | <head> | |
fd6b8dad | 4 | <link rel="stylesheet" href="../dist/dygraph.css"> |
4c765ad9 | 5 | <title>UTC date labels</title> |
fbd6834a | 6 | <script type="text/javascript" src="../dist/dygraph.js"></script> |
4c765ad9 JPB |
7 | </head> |
8 | <body> | |
9 | ||
10 | <h2>UTC date and time labels</h2> | |
11 | ||
12 | <p>This shows how date ticks and labels may be generated according to local | |
8c0599e3 | 13 | time (default) or UTC with the option <code>labelsUTC</code>.</p> |
4c765ad9 JPB |
14 | |
15 | <p>72 hours of random hourly data since 2009-Jul-23 18:00 UTC | |
16 | according to local time (top) and UTC (bottom):</p> | |
17 | ||
18 | <div id="div_loc" style="width:600px; height:200px;"></div> | |
19 | <div id="div_utc" style="width:600px; height:200px;"></div> | |
20 | ||
21 | <p>Please note the offset between the respective ticks in both plots. | |
22 | It should match your local time zone offset.</p> | |
23 | ||
24 | <p>You can also check it by hovering over corresponding points and comparing | |
25 | the value labels.</p> | |
26 | ||
27 | <p>Try different zoom levels to show that ticks are always placed at nice | |
28 | time boundaries.</p> | |
29 | ||
30 | <script type="text/javascript"> | |
31 | var data = (function() { | |
32 | var rand10 = function () { return Math.round(10 * Math.random()); }; | |
33 | var a = [] | |
34 | for (var y = 2009, m = 6, d = 23, hh = 18, n=0; n < 72; n++) { | |
35 | a.push([new Date(Date.UTC(y, m, d, hh + n, 0, 0)), rand10()]); | |
36 | } | |
37 | return a; | |
38 | })(); | |
39 | gloc = new Dygraph( | |
40 | document.getElementById("div_loc"), | |
41 | data, | |
42 | { | |
43 | labels: ['local time', 'random'] | |
44 | } | |
45 | ); | |
46 | gutc = new Dygraph( | |
47 | document.getElementById("div_utc"), | |
48 | data, | |
49 | { | |
8c0599e3 | 50 | labelsUTC: true, |
4c765ad9 JPB |
51 | labels: ['UTC', 'random'] |
52 | } | |
53 | ); | |
54 | </script> | |
55 | ||
56 | </body> | |
57 | </html> |