Use CSS for tests, gallery and docs
[dygraphs.git] / tests / daylight-savings.html
CommitLineData
54425b14 1<!DOCTYPE html>
d1bce5a0
DV
2<html>
3 <head>
93a5bb4c 4 <link rel="stylesheet" href="../css/dygraph.css">
d1bce5a0 5 <title>Daylight Savings</title>
7e5ddc94
DV
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>
7e5ddc94 11
0b4cf8f0
DV
12 <style>
13 body {
14 max-width: 1024px;
15 }
16 </style>
17
d1bce5a0
DV
18 </head>
19 <body>
20 <h2>DST</h2>
21 <p>This tests that tick marks don't break when the axis crosses into
22 daylight savings time.</p>
23
24 <div id="demodiv"></div>
25
35a3b119
DV
26 <p>The tick marks should all be on day boundaries or nice hours (6, 12, 18),
27 rather than on odd time boundaries like 5, 11, 17 and 23.</p>
28
fef315fe
DV
29 <hr/>
30 <div id="chart2"></div>
31 <p>This chart shows a continuous line going across the "fall back" EST/EDT event. You may need to switch your computer's time zone to Eastern to see this. The x-axis tick marks go from 01:00 &rarr; 01:55 and then back to 01:00.</p>
32
0b4cf8f0
DV
33 <hr/>
34 <div id="chart3"></div>
35 <p>This chart is analogous to the first, except at a "spring forward".</p>
36
37 <hr/>
38 <div id="chart4"></div>
39 <p>This chart shows a continuous series which crosses a "spring forward". The x-axis ticks should skip from 1:55AM to 3:00AM.</p>
40
d1bce5a0
DV
41 <script type="text/javascript">
42 g = new Dygraph(
43 document.getElementById("demodiv"),
44"Date/Time,Purchases\n" +
45"2010-11-05 00:00:00,167082\n" +
46"2010-11-06 00:00:00,168571\n" +
47"2010-11-07 00:00:00,177796\n" +
48"2010-11-08 00:00:00,165587\n" +
35a3b119 49"2010-11-09 00:00:00,164380\n",
0f9bf369
DV
50 {
51 width: 1024
52 }
d1bce5a0 53 );
fef315fe
DV
54
55 // Generate data which crosses the EST/EDT boundary.
56 var dst_data = [];
57 var base_ms = 1383454200000;
58 for (var x = base_ms; x < base_ms + 1000 * 60 * 80; x += 1000) {
59 dst_data.push([new Date(x), x]);
60 }
61
0b4cf8f0 62 g2 = new Dygraph(
fef315fe
DV
63 document.getElementById("chart2"),
64 dst_data,
65 { width: 1024, labels: ['Date', 'Value'] }
66 );
0b4cf8f0
DV
67
68 g3 = new Dygraph(
69 document.getElementById("chart3"),
70"Date/Time,Purchases\n" +
71"2011-03-11 00:00:00,167082\n" +
72"2011-03-12 00:00:00,168571\n" +
73"2011-03-13 00:00:00,177796\n" +
74"2011-03-14 00:00:00,165587\n" +
75"2011-03-15 00:00:00,164380\n",
76 {
77 width: 1024,
78 dateWindow: [1299989043119.4365, 1300080693627.4866]
79 }
80 );
81
82 var base_ms_spring = 1299999000000;
83 var dst_data_spring = [];
84 for (var x = base_ms_spring; x < base_ms_spring + 1000 * 60 * 80; x += 1000) {
85 dst_data_spring.push([new Date(x), x]);
86 }
87
88 g4 = new Dygraph(
89 document.getElementById("chart4"),
90 dst_data_spring,
91 { width: 1024, labels: ['Date', 'Value'] }
92 );
93
d1bce5a0
DV
94 </script>
95</body>
96</html>