1 // Copyright (c) 2012 Google, Inc.
3 // Permission is hereby granted, free of charge, to any person obtaining a copy
4 // of this software and associated documentation files (the "Software"), to deal
5 // in the Software without restriction, including without limitation the rights
6 // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 // copies of the Software, and to permit persons to whom the Software is
8 // furnished to do so, subject to the following conditions:
10 // The above copyright notice and this permission notice shall be included in
11 // all copies or substantial portions of the Software.
13 // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
22 * @fileoverview Test cases for drawing lines with missing points.
24 * @author konigsberg@google.com (Robert Konigsberg)
26 var ZERO_TO_FIFTY
= [[ 10, 0 ] , [ 20, 50 ]];
28 describe("missing-points", function() {
30 var _origFunc
= Dygraph
.getContext
;
31 beforeEach(function() {
32 document
.body
.innerHTML
= "<div id='graph'></div>";
33 Dygraph
.getContext
= function(canvas
) {
34 return new Proxy(_origFunc(canvas
));
38 afterEach(function() {
39 Dygraph
.getContext
= _origFunc
;
42 it('testSeparatedPointsDontDraw', function() {
43 var graph
= document
.getElementById("graph");
49 { colors
: ['red', 'blue']});
50 var htx
= g
.hidden_ctx_
;
51 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#ff0000'));
52 assert
.equal(0, CanvasAssertions
.numLinesDrawn(htx
, '#0000ff'));
55 it('testSeparatedPointsDontDraw_expanded', function() {
56 var graph
= document
.getElementById("graph");
64 { colors
: ['blue'], labels
: ['X', 'Y']});
65 var htx
= g
.hidden_ctx_
;
67 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#0000ff'));
68 CanvasAssertions
.assertLineDrawn(htx
, [56, 275], [161, 212],
69 { strokeStyle
: '#0000ff', });
70 CanvasAssertions
.assertLineDrawn(htx
, [370, 87], [475, 25],
71 { strokeStyle
: '#0000ff', });
74 it('testSeparatedPointsDontDraw_expanded_connected', function() {
75 var graph
= document
.getElementById("graph");
85 connectSeparatedPoints
: true,
88 var htx
= g
.hidden_ctx_
;
91 assert
.equal(3, CanvasAssertions
.numLinesDrawn(htx
, '#0000ff'));
92 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
93 [[56, 275], [161, 212], [370, 87], [475, 25]],
94 { strokeStyle
: '#0000ff' });
98 * At the time of writing this test, the blue series is only points, and not lines.
100 it('testConnectSeparatedPoints', function() {
102 document
.getElementById("graph"),
112 connectSeparatedPoints
: true,
114 colors
: ['red', 'blue'],
115 labels
: ['X', 'Y1', 'Y2']
119 var htx
= g
.hidden_ctx_
;
121 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#0000ff'));
122 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
123 [[56, 225], [223, 25], [391, 125]],
124 { strokeStyle
: '#0000ff' });
126 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#ff0000'));
127 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
128 [[140, 275], [307, 125], [475, 225]],
129 { strokeStyle
: '#ff0000' });
133 * At the time of writing this test, the blue series is only points, and not lines.
135 it('testConnectSeparatedPointsWithNan', function() {
137 document
.getElementById("graph"),
148 connectSeparatedPoints
: true,
150 colors
: ['red', 'blue']
154 var htx
= g
.hidden_ctx_
;
156 // Red has two disconnected line segments
157 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#ff0000'));
158 CanvasAssertions
.assertLineDrawn(htx
, [102, 275], [195, 212], { strokeStyle
: '#ff0000' });
159 CanvasAssertions
.assertLineDrawn(htx
, [381, 87], [475, 25], { strokeStyle
: '#ff0000' });
161 // Blue's lines are consecutive, however.
162 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#0000ff'));
163 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
164 [[56, 244], [149, 181], [242, 118]],
165 { strokeStyle
: '#0000ff' });
168 /* These lines contain awesome powa!
169 var lines = CanvasAssertions.getLinesDrawn(htx, {strokeStyle: "#0000ff"});
170 for (var idx = 0; idx < lines.length; idx++) {
171 var line = lines[idx];
172 console.log(line[0].args, line[1].args, line[0].properties.strokeStyle);
176 it('testErrorBarsWithMissingPoints', function() {
186 document
.getElementById("graph"),
195 var htx
= g
.hidden_ctx_
;
197 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#ff0000'));
199 var p0
= g
.toDomCoords(data
[0][0], data
[0][1][0]);
200 var p1
= g
.toDomCoords(data
[1][0], data
[1][1][0]);
201 var p2
= g
.toDomCoords(data
[3][0], data
[3][1][0]);
202 var p3
= g
.toDomCoords(data
[4][0], data
[4][1][0]);
203 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
204 [p0
, p1
], { strokeStyle
: '#ff0000' });
205 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
206 [p2
, p3
], { strokeStyle
: '#ff0000' });
209 it('testErrorBarsWithMissingPointsConnected', function() {
219 document
.getElementById("graph"),
222 connectSeparatedPoints
: true,
230 var htx
= g
.hidden_ctx_
;
232 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#ff0000'));
234 var p1
= g
.toDomCoords(data
[1][0], data
[1][1][0]);
235 var p2
= g
.toDomCoords(data
[3][0], data
[3][1][0]);
236 var p3
= g
.toDomCoords(data
[5][0], data
[5][1][0]);
237 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
239 { strokeStyle
: '#ff0000' });
241 it('testCustomBarsWithMissingPoints', function() {
248 [6, [null,null,null]],
257 document
.getElementById("graph"),
266 var htx
= g
.hidden_ctx_
;
268 assert
.equal(4, CanvasAssertions
.numLinesDrawn(htx
, '#ff0000'));
270 var p0
= g
.toDomCoords(data
[0][0], data
[0][1][1]);
271 var p1
= g
.toDomCoords(data
[1][0], data
[1][1][1]);
272 CanvasAssertions
.assertLineDrawn(htx
, p0
, p1
, { strokeStyle
: '#ff0000' });
274 p0
= g
.toDomCoords(data
[3][0], data
[3][1][1]);
275 p1
= g
.toDomCoords(data
[4][0], data
[4][1][1]);
276 CanvasAssertions
.assertLineDrawn(htx
, p0
, p1
, { strokeStyle
: '#ff0000' });
278 p0
= g
.toDomCoords(data
[6][0], data
[6][1][1]);
279 p1
= g
.toDomCoords(data
[7][0], data
[7][1][1]);
280 CanvasAssertions
.assertLineDrawn(htx
, p0
, p1
, { strokeStyle
: '#ff0000' });;
282 p0
= g
.toDomCoords(data
[9][0], data
[9][1][1]);
283 p1
= g
.toDomCoords(data
[10][0], data
[10][1][1]);
284 CanvasAssertions
.assertLineDrawn(htx
, p0
, p1
, { strokeStyle
: '#ff0000' });
287 it('testCustomBarsWithMissingPointsConnected', function() {
293 [5, [null,null,null]],
297 document
.getElementById("graph"),
300 connectSeparatedPoints
: true,
308 var htx
= g
.hidden_ctx_
;
310 assert
.equal(2, CanvasAssertions
.numLinesDrawn(htx
, '#ff0000'));
312 var p1
= g
.toDomCoords(data
[1][0], data
[1][1][1]);
313 var p2
= g
.toDomCoords(data
[3][0], data
[3][1][1]);
314 var p3
= g
.toDomCoords(data
[5][0], data
[5][1][1]);
315 CanvasAssertions
.assertConsecutiveLinesDrawn(htx
,
317 { strokeStyle
: '#ff0000' });
320 it('testLeftBoundaryWithMisingPoints', function() {
330 document
.getElementById("graph"),
333 connectSeparatedPoints
: true,
335 colors
: ['red','blue'],
336 labels
: ['X', 'Y1', 'Y2']
339 g
.updateOptions({ dateWindow
: [ 2.5, 4.5 ] });
340 assert
.equal(1, g
.getLeftBoundary_(0));
341 assert
.equal(0, g
.getLeftBoundary_(1));
343 var domX
= g
.toDomXCoord(1.9);
344 var closestRow
= g
.findClosestRow(domX
);
345 assert
.equal(1, closestRow
);
347 g
.setSelection(closestRow
);
348 assert
.equal(1, g
.selPoints_
.length
);
349 assert
.equal(1, g
.selPoints_
[0].yval
);
352 assert
.equal(2, g
.selPoints_
.length
);
353 assert
.equal(g
.selPoints_
[0].xval
, g
.selPoints_
[1].xval
);
354 assert
.equal(2, g
.selPoints_
[0].yval
);
355 assert
.equal(1, g
.selPoints_
[1].yval
);
358 // Regression test for issue #411
359 it('testEmptySeries', function() {
360 var graphDiv
= document
.getElementById("graph");
363 "Time,Empty Series,Series 1,Series 2\n" +
364 "1381134460,,0,100\n" +
365 "1381134461,,1,99\n" +
366 "1381134462,,2,98\n" +
367 "1381134463,,3,97\n" +
368 "1381134464,,4,96\n" +
369 "1381134465,,5,95\n" +
370 "1381134466,,6,94\n" +
371 "1381134467,,7,93\n" +
372 "1381134468,,8,92\n" +
373 "1381134469,,9,91\n", {
374 visibility
: [true, false, true],
375 dateWindow
: [1381134465, 1381134467]
379 assert
.equal("1381134466: Series 2: 94", Util
.getLegend(graphDiv
));
382 // Regression test for issue #485
383 it('testMissingFill', function() {
384 var graphDiv
= document
.getElementById("graph");
392 [4, [9, N
, 2] ], // Note: nulls in arrays are not technically valid.
393 [5, [N
, 2, N
] ], // see dygraphs.com/data.html
.
398 connectSeparatedPoints
: false,
399 labels
: [ "X", "Series1"]
403 // Make sure there are no 'NaN' line segments.
404 var htx
= g
.hidden_ctx_
;
405 for (var i
= 0; i
< htx
.calls__
.length
; i
++) {
406 var call
= htx
.calls__
[i
];
407 if ((call
.name
== 'moveTo' || call
.name
== 'lineTo') && call
.args
) {
408 for (var j
= 0; j
< call
.args
.length
; j
++) {
409 assert
.isFalse(isNaN(call
.args
[j
]));