Remove legacy options:
[dygraphs.git] / auto_tests / tests / stacked.js
CommitLineData
890e2a37
DV
1/**
2 * @fileoverview Tests using the "stackedGraph" option.
3 *
4 * @author dan@dygraphs.com (Dan Vanderkam)
5 */
6var stackedTestCase = TestCase("stacked");
7
30a5cfc6
KW
8stackedTestCase._origGetContext = Dygraph.getContext;
9
890e2a37
DV
10stackedTestCase.prototype.setUp = function() {
11 document.body.innerHTML = "<div id='graph'></div>";
30a5cfc6
KW
12 Dygraph.getContext = function(canvas) {
13 return new Proxy(stackedTestCase._origGetContext(canvas));
14 }
890e2a37
DV
15};
16
17stackedTestCase.prototype.tearDown = function() {
30a5cfc6 18 Dygraph.getContext = stackedTestCase._origGetContext;
890e2a37
DV
19};
20
21stackedTestCase.prototype.testCorrectColors = function() {
22 var opts = {
23 width: 400,
24 height: 300,
25 stackedGraph: true,
bfb3e0a4
RK
26 axes : {
27 x : {
28 drawGrid: false,
29 drawAxis: false,
30 },
31 y : {
32 drawGrid: false,
33 drawAxis: false,
34 }
35 },
890e2a37
DV
36 valueRange: [0, 3],
37 colors: ['#00ff00', '#0000ff'],
38 fillAlpha: 0.15
39 };
40 var data = "X,Y1,Y2\n" +
41 "0,1,1\n" +
42 "1,1,1\n" +
43 "2,1,1\n" +
44 "3,1,1\n"
45 ;
46
47 var graph = document.getElementById("graph");
48 var g = new Dygraph(graph, data, opts);
49
50 // y pixels 299-201 = y2 = transparent blue
51 // y pixel 200 = y2 line (blue)
52 // y pixels 199-101 = y1 = transparent green
53 // y pixel 100 = y1 line (green)
54 // y pixels 0-99 = nothing (white)
55
890e2a37 56 // 38 = round(0.15 * 255)
37819481
PH
57 assertEquals([0, 0, 255, 38], Util.samplePixel(g.hidden_, 200, 250));
58 assertEquals([0, 255, 0, 38], Util.samplePixel(g.hidden_, 200, 150));
890e2a37 59};
9b3d9459
DV
60
61// Regression test for http://code.google.com/p/dygraphs/issues/detail?id=358
62stackedTestCase.prototype.testSelectionValues = function() {
63 var opts = {
64 stackedGraph: true
65 };
66 var data = "X,Y1,Y2\n" +
67 "0,1,1\n" +
68 "1,1,1\n" +
69 "2,1,1\n" +
70 "3,1,1\n"
71 ;
72
73 var graph = document.getElementById("graph");
74 g = new Dygraph(graph, data, opts);
75
76 g.setSelection(0);
77
79aabc9d 78 assertEquals("0: Y1: 1 Y2: 1", Util.getLegend());
9b3d9459
DV
79
80 // Verify that the behavior is correct with highlightSeriesOpts as well.
81 g.updateOptions({
82 highlightSeriesOpts: {
83 strokeWidth: 10
84 }
85 });
fa11f4e4
DV
86 g.setSelection(0);
87 assertEquals("0: Y1: 1 Y2: 1", Util.getLegend());
88
9b3d9459 89 g.setSelection(1);
79aabc9d 90 assertEquals("1: Y1: 1 Y2: 1", Util.getLegend());
9b3d9459
DV
91
92 g.setSelection(0, 'Y2');
79aabc9d 93 assertEquals("0: Y1: 1 Y2: 1", Util.getLegend());
9b3d9459 94};
12b879f4
DV
95
96// Regression test for http://code.google.com/p/dygraphs/issues/detail?id=176
97stackedTestCase.prototype.testDuplicatedXValue = function() {
98 var opts = {
99 stackedGraph: true,
100 fillAlpha: 0.15,
101 colors: ['#00ff00'],
102 width: 400,
103 height: 300
104 };
105 var data = "X,Y1\n" +
106 "0,1\n" +
107 "1,1\n" +
108 "2,1\n" +
109 "2,1\n" + // duplicate x-value!
110 "3,1\n"
111 ;
112
113 var graph = document.getElementById("graph");
114 g = new Dygraph(graph, data, opts);
115
116 assert(g.yAxisRange()[1] < 2);
117
118 assertEquals([0, 255, 0, 38], Util.samplePixel(g.hidden_, 200, 250));
119 assertEquals([0, 255, 0, 38], Util.samplePixel(g.hidden_, 317, 250));
120}
907121a8
VS
121
122// Validates regression when null values in stacked graphs show up
123// incorrectly in the legend.
124stackedTestCase.prototype.testNullValues = function() {
125 var opts = {
126 stackedGraph: true,
127 stepPlot:true
128 };
129 var data = "X,Y1,Y2,Y3\n" +
130 "0,-5,-1,1\n" +
131 "1,1,,1\n" +
132 "2,1,2,3\n" +
133 "3,3,,4\n" +
134 "4,3,2,3\n"
135 ;
136
137 var graph = document.getElementById("graph");
138 g = new Dygraph(graph, data, opts);
139
140 g.setSelection(0);
141 assertEquals("0: Y1: -5 Y2: -1 Y3: 1", Util.getLegend());
142
143 g.setSelection(1);
144 assertEquals("1: Y1: 1 Y3: 1", Util.getLegend());
145
146 g.setSelection(2);
147 assertEquals("2: Y1: 1 Y2: 2 Y3: 3", Util.getLegend());
148
149 g.setSelection(3);
150 assertEquals("3: Y1: 3 Y3: 4", Util.getLegend());
151
152 g.setSelection(4);
153 assertEquals("4: Y1: 3 Y2: 2 Y3: 3", Util.getLegend());
154};
cc87e270
VS
155
156// Regression test for http://code.google.com/p/dygraphs/issues/detail?id=438
157stackedTestCase.prototype.testMissingValueAtZero = function() {
158 var opts = {
159 stackedGraph: true
160 };
161 var data = "X,Y1,Y2\n" +
162 "0,,1\n" +
163 "1,1,2\n" +
164 "2,,3\n"
165 ;
166
167 var graph = document.getElementById("graph");
168 g = new Dygraph(graph, data, opts);
169
170 g.setSelection(0);
171 assertEquals("0: Y2: 1", Util.getLegend());
172
173 g.setSelection(1);
174 assertEquals("1: Y1: 1 Y2: 2", Util.getLegend());
175
176 g.setSelection(2);
177 assertEquals("2: Y2: 3", Util.getLegend());
178};
30a5cfc6
KW
179
180stackedTestCase.prototype.testInterpolation = function() {
181 var opts = {
182 colors: ['#ff0000', '#00ff00', '#0000ff'],
183 stackedGraph: true
184 };
185
186 // The last series is all-NaN, it ought to be treated as all zero
187 // for stacking purposes.
188 var N = NaN;
189 var data = [
190 [100, 1, 2, N, N],
191 [101, 1, 2, 2, N],
192 [102, 1, N, N, N],
193 [103, 1, 2, 4, N],
194 [104, N, N, N, N],
195 [105, 1, 2, N, N],
196 [106, 1, 2, 7, N],
197 [107, 1, 2, 8, N],
198 [108, 1, 2, 9, N],
199 [109, 1, N, N, N]];
200
201 var graph = document.getElementById("graph");
202 g = new Dygraph(graph, data, opts);
203
204 var htx = g.hidden_ctx_;
205 var attrs = {};
206
207 // Check that lines are drawn at the expected positions, using
208 // interpolated values for missing data.
209 CanvasAssertions.assertLineDrawn(
210 htx, g.toDomCoords(100, 4), g.toDomCoords(101, 4), {strokeStyle: '#00ff00'});
211 CanvasAssertions.assertLineDrawn(
212 htx, g.toDomCoords(102, 6), g.toDomCoords(103, 7), {strokeStyle: '#ff0000'});
213 CanvasAssertions.assertLineDrawn(
214 htx, g.toDomCoords(107, 8), g.toDomCoords(108, 9), {strokeStyle: '#0000ff'});
215 CanvasAssertions.assertLineDrawn(
216 htx, g.toDomCoords(108, 12), g.toDomCoords(109, 12), {strokeStyle: '#ff0000'});
217
218 // Check that the expected number of line segments gets drawn
219 // for each series. Gaps don't get a line.
220 assertEquals(7, CanvasAssertions.numLinesDrawn(htx, '#ff0000'));
221 assertEquals(4, CanvasAssertions.numLinesDrawn(htx, '#00ff00'));
222 assertEquals(2, CanvasAssertions.numLinesDrawn(htx, '#0000ff'));
223
224 // Check that the selection returns the original (non-stacked)
225 // values and skips gaps.
226 g.setSelection(1);
227 assertEquals("101: Y1: 1 Y2: 2 Y3: 2", Util.getLegend());
228
229 g.setSelection(8);
230 assertEquals("108: Y1: 1 Y2: 2 Y3: 9", Util.getLegend());
231
232 g.setSelection(9);
233 assertEquals("109: Y1: 1", Util.getLegend());
234};
235
236stackedTestCase.prototype.testInterpolationOptions = function() {
237 var opts = {
238 colors: ['#ff0000', '#00ff00', '#0000ff'],
239 stackedGraph: true
240 };
241
242 var data = [
243 [100, 1, NaN, 3],
244 [101, 1, 2, 3],
245 [102, 1, NaN, 3],
246 [103, 1, 2, 3],
247 [104, 1, NaN, 3]];
248
249 var choices = ['all', 'inside', 'none'];
250 var stackedY = [
251 [6, 6, 6, 6, 6],
252 [4, 6, 6, 6, 4],
253 [4, 6, 4, 6, 4]];
254
255 for (var i = 0; i < choices.length; ++i) {
256 var graph = document.getElementById("graph");
257 opts['stackedGraphNaNFill'] = choices[i];
258 g = new Dygraph(graph, data, opts);
259
260 var htx = g.hidden_ctx_;
261 var attrs = {};
262
263 // Check top lines get drawn at the expected positions.
264 for (var j = 0; j < stackedY[i].length - 1; ++j) {
265 CanvasAssertions.assertLineDrawn(
266 htx,
267 g.toDomCoords(100 + j, stackedY[i][j]),
268 g.toDomCoords(101 + j, stackedY[i][j + 1]),
269 {strokeStyle: '#ff0000'});
270 }
271 }
272};
0d087599
JJS
273
274stackedTestCase.prototype.testMultiAxisInterpolation = function() {
275 // Setting 2 axes to test that each axis stacks separately
276 var opts = {
277 colors: ['#ff0000', '#00ff00', '#0000ff'],
278 stackedGraph: true,
279 series: {
280 "Y1": {
281 axis: 'y',
282 },
283 "Y2": {
284 axis: 'y',
285 },
286 "Y3": {
287 axis: 'y2',
288 },
289 "Y4": {
290 axis: 'y2',
291 }
292 }
293 };
294
295 // The last series is all-NaN, it ought to be treated as all zero
296 // for stacking purposes.
297 var N = NaN;
298 var data = [
299 [100, 1, 2, N, N],
300 [101, 1, 2, 2, N],
301 [102, 1, N, N, N],
302 [103, 1, 2, 4, N],
303 [104, N, N, N, N],
304 [105, 1, 2, N, N],
305 [106, 1, 2, 7, N],
306 [107, 1, 2, 8, N],
307 [108, 1, 2, 9, N],
308 [109, 1, N, N, N]];
309
310 var graph = document.getElementById("graph");
311 g = new Dygraph(graph, data, opts);
312
313 var htx = g.hidden_ctx_;
314 var attrs = {};
315
316 // Check that lines are drawn at the expected positions, using
317 // interpolated values for missing data.
318 CanvasAssertions.assertLineDrawn(
319 htx, g.toDomCoords(100, 2), g.toDomCoords(101, 2), {strokeStyle: '#00ff00'});
320 CanvasAssertions.assertLineDrawn(
321 htx, g.toDomCoords(102, 3), g.toDomCoords(103, 3), {strokeStyle: '#ff0000'});
322 CanvasAssertions.assertLineDrawn(
323 htx, g.toDomCoords(107, 2.71), g.toDomCoords(108, 3), {strokeStyle: '#0000ff'});
324 CanvasAssertions.assertLineDrawn(
325 htx, g.toDomCoords(108, 3), g.toDomCoords(109, 3), {strokeStyle: '#ff0000'});
326
327 // Check that the expected number of line segments gets drawn
328 // for each series. Gaps don't get a line.
329 assertEquals(7, CanvasAssertions.numLinesDrawn(htx, '#ff0000'));
330 assertEquals(4, CanvasAssertions.numLinesDrawn(htx, '#00ff00'));
331 assertEquals(2, CanvasAssertions.numLinesDrawn(htx, '#0000ff'));
332
333 // Check that the selection returns the original (non-stacked)
334 // values and skips gaps.
335 g.setSelection(1);
336 assertEquals("101: Y1: 1 Y2: 2 Y3: 2", Util.getLegend());
337
338 g.setSelection(8);
339 assertEquals("108: Y1: 1 Y2: 2 Y3: 9", Util.getLegend());
340
341 g.setSelection(9);
342 assertEquals("109: Y1: 1", Util.getLegend());
343};