auto_tests/tests/connect_separated_points.js

   1 /**
   2  * @fileoverview Test cases for the option "connectSeparatedPoints" especially for the scenario where not every series has a value for each timestamp.
   3  *
   4  * @author julian.eichstaedt@ch.sauter-bc.com (Fr. Sauter AG)
   5  */
   6 var ConnectSeparatedPointsTestCase = TestCase("connect-separated-points");
   7
   8 ConnectSeparatedPointsTestCase.prototype.setUp = function() {
   9   document.body.innerHTML = "<div id='graph'></div>";
  10 };
  11
  12 ConnectSeparatedPointsTestCase.origFunc = Dygraph.getContext;
  13
  14 ConnectSeparatedPointsTestCase.prototype.setUp = function() {
  15   document.body.innerHTML = "<div id='graph'></div>";
  16   Dygraph.getContext = function(canvas) {
  17     return new Proxy(ConnectSeparatedPointsTestCase.origFunc(canvas));
  18   };
  19 };
  20
  21 ConnectSeparatedPointsTestCase.prototype.tearDown = function() {
  22   Dygraph.getContext = ConnectSeparatedPointsTestCase.origFunc;
  23 };
  24
  25 ConnectSeparatedPointsTestCase.prototype.testEdgePointsSimple = function() {
  26   var opts = {
  27     width: 480,
  28     height: 320,
  29 //    drawXGrid: false,
  30 //    drawYGrid: false,
  31 //    drawXAxis: false,
  32 //    drawYAxis: false,
  33 //    errorBars: false,
  34     labels: ["x", "series1", "series2", "series3"],
  35     connectSeparatedPoints: true,
  36     drawPoints: true,
  37     dateWindow: [1.5,6.5]
  38   };
  39
  40   var data = [
  41               [-7,-1000,0,null],
  42               [-6,null,2,null],
  43               [-5,null,2,null],
  44               [-4,null,2,null],
  45               [-3,null,2,null],
  46               [-2,null,2,null],
  47               [-1,null,2,null],
  48               [0,null,2,null],
  49               [1,null,4,null],
  50               [2,0.5,0,null],
  51               [3,1,-1,5],
  52               [4,2,-2,6],
  53               [5,2.5,-2.5,7],
  54               [6,3,-3,4],
  55               [7,4,null,5],
  56               [8,4,-10,6],
  57              ];
  58
  59   var graph = document.getElementById("graph");
  60   var g = new Dygraph(graph, data, opts);
  61
  62   htx = g.hidden_ctx_;
  63
  64   var attrs = {};
  65
  66   //Test if series1 is drawn correctly.
  67   //------------------------------------
  68
  69   // The first point of the first series
  70   var x1 = data[0][0];
  71   var y1 = data[0][1];
  72   var xy1 = g.toDomCoords(x1, y1);
  73
  74   // The third (the second valid) point of the first series
  75   // This series has no value at the second position.
  76   var x2 = data[9][0];
  77   var y2 = data[9][1];
  78   var xy2 = g.toDomCoords(x2, y2);
  79
  80   // Check if both points are connected at the left edge of the canvas and if the option "connectSeparatedPoints" works properly
  81   // even if the point is outside the visible range and only one series has a valid value for this point.
  82   CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
  83
  84   //Test if series2 is drawn correctly.
  85   //------------------------------------
  86
  87   // The sixth point of the second series
  88   // Use the sixth and NOT the seventh point despite this series has eight points
  89   // since this series has no value at the seventh position.
  90   var x1 = data[13][0];
  91   var y1 = data[13][2];
  92   var xy1 = g.toDomCoords(x1, y1);
  93
  94   // The last point of the second series.
  95   var x2 = data[15][0];
  96   var y2 = data[15][2];
  97   var xy2 = g.toDomCoords(x2, y2);
  98
  99   // Check if both points are connected at the right edge of the canvas and if the option "connectSeparatedPoints" works properly
 100   // even if the point is outside the visible range and only one series has a valid value for this point.
 101   CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
 102 };
 103
 104 ConnectSeparatedPointsTestCase.prototype.testEdgePointsStacked = function() {
 105   var opts = {
 106     width: 480,
 107     height: 320,
 108 //    drawXGrid: false,
 109 //    drawYGrid: false,
 110 //    drawXAxis: false,
 111 //    drawYAxis: false,
 112 //    errorBars: false,
 113     labels: ["x", "series1", "series2", "series3"],
 114     connectSeparatedPoints: true,
 115     drawPoints: true,
 116     stackedGraph: true,
 117     dateWindow: [1.5,6.5]
 118   };
 119
 120   var data = [
 121               [-7,null,1,0],
 122               [-6,null,3,null],
 123               [-5,null,3,null],
 124               [-4,null,3,null],
 125               [-3,null,3,null],
 126               [-2,null,3,null],
 127               [-1,null,3,null],
 128               [0,null,3,null],
 129               [1,null,3,null],
 130               [2,null,1,3],
 131               [3,3,1,1],
 132               [4,4,2,2],
 133               [5,3,2,2],
 134               [6,3,1,3],
 135               [7,4,null,2],
 136               [8,5,2,1],
 137              ];
 138
 139   var graph = document.getElementById("graph");
 140   var g = new Dygraph(graph, data, opts);
 141
 142   htx = g.hidden_ctx_;
 143
 144   var attrs = {};
 145
 146   //Test if series1 is drawn correctly.
 147   //------------------------------------
 148
 149   // The first point of the first series
 150   var x1 = data[0][0];
 151   var y1 = data[0][1];
 152   var xy1 = g.toDomCoords(x1, y1);
 153
 154   // The third (the second valid) point of the first series
 155   // This series has no value at the second position.
 156   var x2 = data[9][0];
 157   var y2 = data[9][1];
 158   var xy2 = g.toDomCoords(x2, y2);
 159
 160   // Check if both points are connected at the left edge of the canvas and if the option "connectSeparatedPoints" works properly
 161   // even if the point is outside the visible range and only one series has a valid value for this point.
 162   CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
 163
 164   //Test if series2 is drawn correctly.
 165   //------------------------------------
 166
 167   // The sixth point of the second series
 168   // Use the sixth and NOT the seventh point despite this series has eight points
 169   // since this series has no value at the seventh position.
 170   var x1 = data[13][0];
 171   var y1 = data[13][2];
 172   var xy1 = g.toDomCoords(x1, y1);
 173
 174   // The last point of the second series.
 175   var x2 = data[15][0];
 176   var y2 = data[15][2];
 177   var xy2 = g.toDomCoords(x2, y2);
 178
 179   // Check if both points are connected at the right edge of the canvas and if the option "connectSeparatedPoints" works properly
 180   // even if the point is outside the visible range and only one series has a valid value for this point.
 181   CanvasAssertions.assertLineDrawn(htx, xy1, xy2, attrs);
 182 };