Use CSS for tests, gallery and docs
[dygraphs.git] / tests / missing-data.html
CommitLineData
54425b14 1<!DOCTYPE html>
1ce3af6f
DV
2<html>
3 <head>
93a5bb4c 4 <link rel="stylesheet" href="../css/dygraph.css">
9a730910 5 <title>missing data</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
1ce3af6f
DV
12 </head>
13 <body>
5011e7a1
DV
14 <table>
15 <tr><td valign=top>
1ce3af6f 16 <div id="graph"></div>
584ceeaa 17 <div id="graph2"></div>
5011e7a1 18 </td><td valign=top>
584ceeaa 19 <div id="graph3"></div>
b7a294a8 20 <div id="graph4"></div>
61d0e7b3
DE
21 </td><td valign=top>
22 <div id="graph5"></div>
23 <div id="graph6"></div>
5011e7a1
DV
24 </td></tr>
25 </table>
584ceeaa 26
1ce3af6f 27 <script type="text/javascript">
24e5350c 28 g = new Dygraph(
1ce3af6f 29 document.getElementById("graph"),
9a730910
DV
30 "Date,GapSeries1,GapSeries2\n" +
31 "2009/12/01,10,10\n" +
32 "2009/12/02,15,11\n" +
33 "2009/12/03,,12\n" +
34 "2009/12/04,20,13\n" +
35 "2009/12/05,15,\n" +
36 "2009/12/06,18,15\n" +
37 "2009/12/07,12,16\n"
1ce3af6f 38 );
584ceeaa 39
24e5350c 40 g2 = new Dygraph(
584ceeaa
DV
41 document.getElementById("graph2"),
42 [
43 [ new Date("2009/12/01"), 10, 10],
44 [ new Date("2009/12/02"), 15, 11],
45 [ new Date("2009/12/03"), null, 12],
46 [ new Date("2009/12/04"), 20, 13],
47 [ new Date("2009/12/05"), 15, null],
48 [ new Date("2009/12/06"), 18, 15],
49 [ new Date("2009/12/07"), 12, 16]
50 ],
2847c1cf
DV
51 {
52 labels: ["Date","GapSeries1","GapSeries2"],
53 showRoller: true
54 }
584ceeaa 55 );
5011e7a1 56
24e5350c 57 g3 = new Dygraph(
5011e7a1
DV
58 document.getElementById("graph3"),
59 [
60 [1, [10, 2], [20, 3]],
bb441ec6
DV
61 [2, [12, 2], [20, 3]],
62 [3, [ 8, 2], [20, 3]],
63 [4, [null, 2], [20, 3]],
0192f267 64 [5, [null, 2], null],
bb441ec6 65 [6, [ 9, 2], [20, 3]],
d16579a0 66 [7, [10, 2], [20, 3]]
5011e7a1
DV
67 ],
68 {
69 errorBars: true,
70 labels: [ "X", "Series1", "Series2" ]
71 }
72 );
b7a294a8 73
24e5350c 74 g4 = new Dygraph(
b7a294a8
DV
75 document.getElementById("graph4"),
76 [
77 [1, [10, 2], [20, 3]],
bb441ec6
DV
78 [2, [12, 2], [20, 3]],
79 [3, [ 8, 2], [20, 3]],
0192f267
DE
80 [4, null, [20, 3]],
81 [5, null, [null, 3]],
bb441ec6 82 [6, [ 9, 2], [20, 3]],
d16579a0 83 [7, [10, 2], [20, 3]]
b7a294a8
DV
84 ],
85 {
86 errorBars: true,
87 rollPeriod: 2,
88 labels: [ "X", "Series1", "Series2" ]
89 }
90 );
61d0e7b3
DE
91
92 g5 = new Dygraph(
93 document.getElementById("graph5"),
94 [
95 [1, [10, 2], [20, 3]],
96 [2, [12, 2], [20, 3]],
97 [3, [ 8, 2], [20, 3]],
98 [4, [2, null], null],
99 [5, null, [null, 3]],
100 [6, [ 9, 2], [20, 3]],
101 [7, [10, 2], [20, 3]]
102 ],
103 {
104 errorBars: true,
0192f267 105 connectSeparatedPoints: false,
61d0e7b3
DE
106 labels: [ "X", "Series1", "Series2" ]
107 }
108 );
109
110 g6 = new Dygraph(
111 document.getElementById("graph6"),
112 [
0192f267
DE
113 [1, [8, 10,12],null],
114 [2, [3, 5,7],[4,6,7]],
115 [3, null,[1,2,4]],
116 [4, [ 9,null, 2],[3,4,8]],
117 [5, [null,2, null],[6,8,9]],
118 [6, [2,3, 6],[2,3,5]]
61d0e7b3
DE
119 ],
120 {
121 customBars: true,
0192f267
DE
122 connectSeparatedPoints: false,
123 labels: [ "X", "Series1", "Series2"]
61d0e7b3
DE
124 }
125 );
1ce3af6f
DV
126 </script>
127 </body>
128</html>