X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;f=auto_tests%2Ftests%2Fstacked.js;h=5e4c55c9d1a836574b8a4d299fcee453d0bf38c5;hb=3ca097d85f74f7c126ae73b6c520a4e49f94dc20;hp=706f56fd2da6a51517a41bc5a18333b8d7336103;hpb=691cb47bb65c604efa9a1f1a6537192f618edb3e;p=dygraphs.git diff --git a/auto_tests/tests/stacked.js b/auto_tests/tests/stacked.js index 706f56f..5e4c55c 100644 --- a/auto_tests/tests/stacked.js +++ b/auto_tests/tests/stacked.js @@ -3,24 +3,36 @@ * * @author dan@dygraphs.com (Dan Vanderkam) */ -var stackedTestCase = TestCase("stacked"); +describe("stacked", function() { -stackedTestCase.prototype.setUp = function() { +var _origGetContext = Dygraph.getContext; + +beforeEach(function() { document.body.innerHTML = "
"; -}; + Dygraph.getContext = function(canvas) { + return new Proxy(_origGetContext(canvas)); + } +}); -stackedTestCase.prototype.tearDown = function() { -}; +afterEach(function() { + Dygraph.getContext = _origGetContext; +}); -stackedTestCase.prototype.testCorrectColors = function() { +it('testCorrectColors', function() { var opts = { width: 400, height: 300, stackedGraph: true, - drawXGrid: false, - drawYGrid: false, - drawXAxis: false, - drawYAxis: false, + axes : { + x : { + drawGrid: false, + drawAxis: false, + }, + y : { + drawGrid: false, + drawAxis: false, + } + }, valueRange: [0, 3], colors: ['#00ff00', '#0000ff'], fillAlpha: 0.15 @@ -41,28 +53,13 @@ stackedTestCase.prototype.testCorrectColors = function() { // y pixel 100 = y1 line (green) // y pixels 0-99 = nothing (white) - // TODO(danvk): factor this and getPixel() into a utility usable by all tests. - var ctx = g.hidden_ctx_; - var imageData = ctx.getImageData(0, 0, 400, 300); - - assertEquals(400, imageData.width); - assertEquals(300, imageData.height); - - // returns an (r, g, b, alpha) tuple for the pixel. - // values are in [0, 255]. - var getPixel = function(imageData, x, y) { - var i = 4 * (x + imageData.width * y); - var d = imageData.data; - return [d[i], d[i+1], d[i+2], d[i+3]]; - }; - // 38 = round(0.15 * 255) - assertEquals([0, 0, 255, 38], getPixel(imageData, 200, 250)); - assertEquals([0, 255, 0, 38], getPixel(imageData, 200, 150)); -}; + assert.deepEqual([0, 0, 255, 38], Util.samplePixel(g.hidden_, 200, 250)); + assert.deepEqual([0, 255, 0, 38], Util.samplePixel(g.hidden_, 200, 150)); +}); // Regression test for http://code.google.com/p/dygraphs/issues/detail?id=358 -stackedTestCase.prototype.testSelectionValues = function() { +it('testSelectionValues', function() { var opts = { stackedGraph: true }; @@ -74,11 +71,11 @@ stackedTestCase.prototype.testSelectionValues = function() { ; var graph = document.getElementById("graph"); - g = new Dygraph(graph, data, opts); + var g = new Dygraph(graph, data, opts); g.setSelection(0); - assertEquals("0: Y1: 1 Y2: 1", Util.getLegend()); + assert.equal("0: Y1: 1 Y2: 1", Util.getLegend()); // Verify that the behavior is correct with highlightSeriesOpts as well. g.updateOptions({ @@ -86,11 +83,266 @@ stackedTestCase.prototype.testSelectionValues = function() { strokeWidth: 10 } }); - // NOTE: calling g.setSelection(0) here makes the test fail, due to an - // unrelated bug. + g.setSelection(0); + assert.equal("0: Y1: 1 Y2: 1", Util.getLegend()); + g.setSelection(1); - assertEquals("1: Y1: 1 Y2: 1", Util.getLegend()); + assert.equal("1: Y1: 1 Y2: 1", Util.getLegend()); g.setSelection(0, 'Y2'); - assertEquals("0: Y1: 1 Y2: 1", Util.getLegend()); -}; + assert.equal("0: Y1: 1 Y2: 1", Util.getLegend()); +}); + +// Regression test for http://code.google.com/p/dygraphs/issues/detail?id=176 +it('testDuplicatedXValue', function() { + var opts = { + stackedGraph: true, + fillAlpha: 0.15, + colors: ['#00ff00'], + width: 400, + height: 300 + }; + var data = "X,Y1\n" + + "0,1\n" + + "1,1\n" + + "2,1\n" + + "2,1\n" + // duplicate x-value! + "3,1\n" + ; + + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, opts); + + assert(g.yAxisRange()[1] < 2); + + assert.deepEqual([0, 255, 0, 38], Util.samplePixel(g.hidden_, 200, 250)); + assert.deepEqual([0, 255, 0, 38], Util.samplePixel(g.hidden_, 317, 250)); +}); + +// Validates regression when null values in stacked graphs show up +// incorrectly in the legend. +it('testNullValues', function() { + var opts = { + stackedGraph: true, + stepPlot:true + }; + var data = "X,Y1,Y2,Y3\n" + + "0,-5,-1,1\n" + + "1,1,,1\n" + + "2,1,2,3\n" + + "3,3,,4\n" + + "4,3,2,3\n" + ; + + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, opts); + + g.setSelection(0); + assert.equal("0: Y1: -5 Y2: -1 Y3: 1", Util.getLegend()); + + g.setSelection(1); + assert.equal("1: Y1: 1 Y3: 1", Util.getLegend()); + + g.setSelection(2); + assert.equal("2: Y1: 1 Y2: 2 Y3: 3", Util.getLegend()); + + g.setSelection(3); + assert.equal("3: Y1: 3 Y3: 4", Util.getLegend()); + + g.setSelection(4); + assert.equal("4: Y1: 3 Y2: 2 Y3: 3", Util.getLegend()); +}); + +// Regression test for http://code.google.com/p/dygraphs/issues/detail?id=438 +it('testMissingValueAtZero', function() { + var opts = { + stackedGraph: true + }; + var data = "X,Y1,Y2\n" + + "0,,1\n" + + "1,1,2\n" + + "2,,3\n" + ; + + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, opts); + + g.setSelection(0); + assert.equal("0: Y2: 1", Util.getLegend()); + + g.setSelection(1); + assert.equal("1: Y1: 1 Y2: 2", Util.getLegend()); + + g.setSelection(2); + assert.equal("2: Y2: 3", Util.getLegend()); +}); + +it('testInterpolation', function() { + var opts = { + colors: ['#ff0000', '#00ff00', '#0000ff'], + stackedGraph: true, + labels: ['X', 'Y1', 'Y2', 'Y3', 'Y4'] + }; + + // The last series is all-NaN, it ought to be treated as all zero + // for stacking purposes. + var N = NaN; + var data = [ + [100, 1, 2, N, N], + [101, 1, 2, 2, N], + [102, 1, N, N, N], + [103, 1, 2, 4, N], + [104, N, N, N, N], + [105, 1, 2, N, N], + [106, 1, 2, 7, N], + [107, 1, 2, 8, N], + [108, 1, 2, 9, N], + [109, 1, N, N, N]]; + + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, opts); + + var htx = g.hidden_ctx_; + var attrs = {}; + + // Check that lines are drawn at the expected positions, using + // interpolated values for missing data. + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(100, 4), g.toDomCoords(101, 4), {strokeStyle: '#00ff00'}); + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(102, 6), g.toDomCoords(103, 7), {strokeStyle: '#ff0000'}); + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(107, 8), g.toDomCoords(108, 9), {strokeStyle: '#0000ff'}); + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(108, 12), g.toDomCoords(109, 12), {strokeStyle: '#ff0000'}); + + // Check that the expected number of line segments gets drawn + // for each series. Gaps don't get a line. + assert.equal(7, CanvasAssertions.numLinesDrawn(htx, '#ff0000')); + assert.equal(4, CanvasAssertions.numLinesDrawn(htx, '#00ff00')); + assert.equal(2, CanvasAssertions.numLinesDrawn(htx, '#0000ff')); + + // Check that the selection returns the original (non-stacked) + // values and skips gaps. + g.setSelection(1); + assert.equal("101: Y1: 1 Y2: 2 Y3: 2", Util.getLegend()); + + g.setSelection(8); + assert.equal("108: Y1: 1 Y2: 2 Y3: 9", Util.getLegend()); + + g.setSelection(9); + assert.equal("109: Y1: 1", Util.getLegend()); +}); + +it('testInterpolationOptions', function() { + var opts = { + colors: ['#ff0000', '#00ff00', '#0000ff'], + stackedGraph: true, + labels: ['X', 'Y1', 'Y2', 'Y3'] + }; + + var data = [ + [100, 1, NaN, 3], + [101, 1, 2, 3], + [102, 1, NaN, 3], + [103, 1, 2, 3], + [104, 1, NaN, 3]]; + + var choices = ['all', 'inside', 'none']; + var stackedY = [ + [6, 6, 6, 6, 6], + [4, 6, 6, 6, 4], + [4, 6, 4, 6, 4]]; + + for (var i = 0; i < choices.length; ++i) { + var graph = document.getElementById("graph"); + opts['stackedGraphNaNFill'] = choices[i]; + var g = new Dygraph(graph, data, opts); + + var htx = g.hidden_ctx_; + var attrs = {}; + + // Check top lines get drawn at the expected positions. + for (var j = 0; j < stackedY[i].length - 1; ++j) { + CanvasAssertions.assertLineDrawn( + htx, + g.toDomCoords(100 + j, stackedY[i][j]), + g.toDomCoords(101 + j, stackedY[i][j + 1]), + {strokeStyle: '#ff0000'}); + } + } +}); + +it('testMultiAxisInterpolation', function() { + // Setting 2 axes to test that each axis stacks separately + var opts = { + colors: ['#ff0000', '#00ff00', '#0000ff'], + stackedGraph: true, + series: { + 'Y1': { + axis: 'y', + }, + 'Y2': { + axis: 'y', + }, + 'Y3': { + axis: 'y2', + }, + 'Y4': { + axis: 'y2', + } + }, + labels: ['X', 'Y1', 'Y2', 'Y3', 'Y4'] + }; + + // The last series is all-NaN, it ought to be treated as all zero + // for stacking purposes. + var N = NaN; + var data = [ + [100, 1, 2, N, N], + [101, 1, 2, 2, N], + [102, 1, N, N, N], + [103, 1, 2, 4, N], + [104, N, N, N, N], + [105, 1, 2, N, N], + [106, 1, 2, 7, N], + [107, 1, 2, 8, N], + [108, 1, 2, 9, N], + [109, 1, N, N, N]]; + + var graph = document.getElementById("graph"); + var g = new Dygraph(graph, data, opts); + + var htx = g.hidden_ctx_; + var attrs = {}; + + // Check that lines are drawn at the expected positions, using + // interpolated values for missing data. + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(100, 2), g.toDomCoords(101, 2), {strokeStyle: '#00ff00'}); + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(102, 3), g.toDomCoords(103, 3), {strokeStyle: '#ff0000'}); + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(107, 2.71), g.toDomCoords(108, 3), {strokeStyle: '#0000ff'}); + CanvasAssertions.assertLineDrawn( + htx, g.toDomCoords(108, 3), g.toDomCoords(109, 3), {strokeStyle: '#ff0000'}); + + // Check that the expected number of line segments gets drawn + // for each series. Gaps don't get a line. + assert.equal(7, CanvasAssertions.numLinesDrawn(htx, '#ff0000')); + assert.equal(4, CanvasAssertions.numLinesDrawn(htx, '#00ff00')); + assert.equal(2, CanvasAssertions.numLinesDrawn(htx, '#0000ff')); + + // Check that the selection returns the original (non-stacked) + // values and skips gaps. + g.setSelection(1); + assert.equal("101: Y1: 1 Y2: 2 Y3: 2", Util.getLegend()); + + g.setSelection(8); + assert.equal("108: Y1: 1 Y2: 2 Y3: 9", Util.getLegend()); + + g.setSelection(9); + assert.equal("109: Y1: 1", Util.getLegend()); +}); + +});