auto_tests/tests/error_bars.js

   1 /**
   2  * @fileoverview FILL THIS IN
   3  *
   4  * @author danvk@google.com (Dan Vanderkam)
   5  */
   6 var errorBarsTestCase = TestCase("error-bars");
   7
   8 errorBarsTestCase.prototype.setUp = function() {
   9   document.body.innerHTML = "<div id='graph'></div>";
  10 };
  11
  12 errorBarsTestCase._origFunc = Dygraph.getContext;
  13 errorBarsTestCase.prototype.setUp = function() {
  14   document.body.innerHTML = "<div id='graph'></div>";
  15   Dygraph.getContext = function(canvas) {
  16     return new Proxy(errorBarsTestCase._origFunc(canvas));
  17   }
  18 };
  19
  20 errorBarsTestCase.prototype.tearDown = function() {
  21   Dygraph.getContext = errorBarsTestCase._origFunc;
  22 };
  23
  24 errorBarsTestCase.prototype.testErrorBarsDrawn = function() {
  25   var opts = {
  26     width: 480,
  27     height: 320,
  28     drawXGrid: false,
  29     drawYGrid: false,
  30     drawXAxis: false,
  31     drawYAxis: false,
  32     customBars: true,
  33     errorBars: true
  34   };
  35   var data = [
  36                [1, [10,  10, 100]],
  37                [2, [15,  20, 110]],
  38                [3, [10,  30, 100]],
  39                [4, [15,  40, 110]],
  40                [5, [10, 120, 100]],
  41                [6, [15,  50, 110]],
  42                [7, [10,  70, 100]],
  43                [8, [15,  90, 110]],
  44                [9, [10,  50, 100]]
  45              ];
  46
  47   var graph = document.getElementById("graph");
  48   var g = new Dygraph(graph, data, opts);
  49
  50   htx = g.hidden_ctx_;
  51
  52   var attrs = {};  // TODO(danvk): fill in
  53
  54   for (var i = 0; i < data.length - 1; i++) {
  55     // bottom line
  56     var xy1 = g.toDomCoords(data[i][0], data[i][1][0]);
  57     var xy2 = g.toDomCoords(data[i + 1][0], data[i + 1][1][0]);
  58     CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
  59
  60     // top line
  61     xy1 = g.toDomCoords(data[i][0], data[i][1][2]);
  62     xy2 = g.toDomCoords(data[i + 1][0], data[i + 1][1][2]);
  63     CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
  64
  65     // middle line
  66     xy1 = g.toDomCoords(data[i][0], data[i][1][1]);
  67     xy2 = g.toDomCoords(data[i + 1][0], data[i + 1][1][1]);
  68     CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
  69   }
  70
  71   g.updateOptions({logscale: true});
  72
  73   for (var i = 0; i < data.length - 1; i++) {
  74     // bottom line
  75     var xy1 = g.toDomCoords(data[i][0], data[i][1][0]);
  76     var xy2 = g.toDomCoords(data[i + 1][0], data[i + 1][1][0]);
  77     CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
  78
  79     // top line
  80     xy1 = g.toDomCoords(data[i][0], data[i][1][2]);
  81     xy2 = g.toDomCoords(data[i + 1][0], data[i + 1][1][2]);
  82     CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
  83
  84     // middle line
  85     xy1 = g.toDomCoords(data[i][0], data[i][1][1]);
  86     xy2 = g.toDomCoords(data[i + 1][0], data[i + 1][1][1]);
  87     CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
  88   }
  89   CanvasAssertions.assertBalancedSaveRestore(htx);
  90 };
  91
  92 errorBarsTestCase.prototype.testErrorBarsCorrectColors = function() {
  93   // Two constant series with constant error.
  94   var data = [
  95     [0, [100, 50], [200, 50]],
  96     [1, [100, 50], [200, 50]]
  97   ];
  98
  99   var opts = {
 100     errorBars: true,
 101     sigma: 1.0,
 102     fillAlpha: 0.15,
 103     colors: ['#00ff00', '#0000ff'],
 104     drawXGrid: false,
 105     drawYGrid: false,
 106     drawXAxis: false,
 107     drawYAxis: false,
 108     width: 400,
 109     height: 300,
 110     valueRange: [0, 300],
 111     labels: ['X', 'Y1', 'Y2']
 112   };
 113   var graph = document.getElementById("graph");
 114   var g = new Dygraph(graph, data, opts);
 115
 116   // y-pixels (0=top, 299=bottom)
 117   //   0- 48: empty (white)
 118   //  49- 98: Y2 error bar
 119   //  99:     Y2 center line
 120   // 100-148: Y2 error bar
 121   // 149-198: Y1 error bar
 122   // 199:     Y1 center line
 123   // 200-248: Y1 error bar
 124   // 249-299: empty (white)
 125   // TODO(danvk): test the edges of these regions.
 126
 127   assertEquals([0, 0, 255, 38], Util.samplePixel(g.hidden_, 200, 75));
 128   assertEquals([0, 0, 255, 38], Util.samplePixel(g.hidden_, 200, 125));
 129   assertEquals([0, 255, 0, 38], Util.samplePixel(g.hidden_, 200, 175));
 130   assertEquals([0, 255, 0, 38], Util.samplePixel(g.hidden_, 200, 225));
 131 };
 132
 133
 134 // Regression test for http://code.google.com/p/dygraphs/issues/detail?id=392
 135 errorBarsTestCase.prototype.testRollingAveragePreservesNaNs = function() {
 136   var graph = document.getElementById("graph");
 137   var g = new Dygraph(graph,
 138   [
 139       [1, [null, null], [3,1]],
 140       [2, [2, 1], [null, null]],
 141       [3, [null, null], [5,1]],
 142       [4, [4, 0.5], [null, null]],
 143       [5, [null, null], [7,1]],
 144       [6, [NaN, NaN], [null, null]],
 145       [8, [8, 1], [null, null]],
 146       [10, [10, 1], [null, null]]
 147      ]
 148         , {
 149           labels: ['x', 'A', 'B' ],
 150           connectSeparatedPoints: true,
 151           drawPoints: true,
 152           errorBars: true
 153         }
 154       );
 155
 156   var in_series = [
 157     [1, [null, null]],
 158     [2, [2, 1]],
 159     [3, [null, null]],
 160     [4, [4, 0.5]],
 161     [5, [null, null]],
 162     [6, [NaN, NaN]],
 163     [8, [8, 1]],
 164     [10, [10, 1]]
 165   ];
 166   assertEquals(null, in_series[4][1][0]);
 167   assertEquals(null, in_series[4][1][1]);
 168   assertNaN(in_series[5][1][0]);
 169   assertNaN(in_series[5][1][1]);
 170
 171   var out_series = g.rollingAverage(in_series, 1);
 172   assertNaN(out_series[5][1][0]);
 173   assertNaN(out_series[5][1][1]);
 174   assertNaN(out_series[5][1][2]);
 175   assertEquals(null, out_series[4][1][0]);
 176   assertEquals(null, out_series[4][1][1]);
 177   assertEquals(null, out_series[4][1][1]);
 178 };