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