auto_tests/tests/range_tests.js

   1 // Copyright (c) 2011 Google, Inc.
   2 //
   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:
   9 //
  10 // The above copyright notice and this permission notice shall be included in
  11 // all copies or substantial portions of the Software.
  12 //
  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
  19 // THE SOFTWARE.
  20
  21
  22 /**
  23  * @fileoverview Test valueRange and dateWindow changes.
  24  *
  25  * @author konigsberg@google.com (Robert Konigsberg)
  26  */
  27 var ZERO_TO_FIFTY = [[ 10, 0 ] , [ 20, 50 ]];
  28 var ZERO_TO_FIFTY_STEPS = (function() {
  29   var a = [];
  30   var x = 10;
  31   var y = 0;
  32   var step = 0;
  33   for (step = 0; step <= 50; step++) {
  34     a.push([x + (step * .2), y + step]);
  35   }
  36   return a;
  37 }());
  38
  39 var FIVE_TO_ONE_THOUSAND = [
  40     [ 1, 10 ], [ 2, 20 ], [ 3, 30 ], [ 4, 40 ] , [ 5, 50 ],
  41     [ 6, 60 ], [ 7, 70 ], [ 8, 80 ], [ 9, 90 ] , [ 10, 1000 ]];
  42
  43 describe("range-tests", function() {
  44
  45 beforeEach(function() {
  46   document.body.innerHTML = "<div id='graph'></div>";
  47 });
  48
  49 var createGraph = function(opts, data, expectRangeX, expectRangeY) {
  50   if (data === undefined) data = ZERO_TO_FIFTY_STEPS;
  51   if (expectRangeX === undefined) expectRangeX = [10, 20];
  52   if (expectRangeY === undefined) expectRangeY = [0, 55];
  53   if (!opts) opts = {};
  54   opts['labels'] = ['X', 'Y'];
  55   var g = new Dygraph('graph', data, opts);
  56
  57   assertDeepCloseTo(expectRangeX, g.xAxisRange(), 0.01);
  58   assertDeepCloseTo(expectRangeY, g.yAxisRange(0), 0.01);
  59
  60   return g;
  61 };
  62
  63 /**
  64  * Test that changes to valueRange and dateWindow are reflected
  65  * appropriately.
  66  */
  67 it('testRangeSetOperations', function() {
  68   var g = createGraph({valueRange : [ 0, 55 ]});
  69
  70   g.updateOptions({ dateWindow : [ 12, 18 ] });
  71   assert.deepEqual([12, 18], g.xAxisRange());
  72   assert.deepEqual([0, 55], g.yAxisRange(0));
  73
  74   g.updateOptions({ valueRange : [ 10, 40 ] });
  75   assert.deepEqual([12, 18], g.xAxisRange());
  76   assert.deepEqual([10, 40], g.yAxisRange(0));
  77
  78   g.updateOptions({ valueRange: [10, NaN] });
  79   assert.deepEqual([12, 18], g.xAxisRange());
  80   assert.deepEqual([10, 44.2], g.yAxisRange(0));
  81
  82   g.updateOptions({ valueRange: [10, 40] });
  83   assert.deepEqual([12, 18], g.xAxisRange());
  84   assert.deepEqual([10, 40], g.yAxisRange(0));
  85
  86   g.updateOptions({ valueRange: [10, null] });
  87   assert.deepEqual([12, 18], g.xAxisRange());
  88   assert.deepEqual([10, 44.2], g.yAxisRange(0));
  89
  90   g.updateOptions({ valueRange: [10, 40] });
  91   assert.deepEqual([12, 18], g.xAxisRange());
  92   assert.deepEqual([10, 40], g.yAxisRange(0));
  93
  94   g.updateOptions({ valueRange: [10, undefined] });
  95   assert.deepEqual([12, 18], g.xAxisRange());
  96   assert.deepEqual([10, 44.2], g.yAxisRange(0));
  97
  98   g.updateOptions({ valueRange: [10, 40] });
  99   assert.deepEqual([12, 18], g.xAxisRange());
 100   assert.deepEqual([10, 40], g.yAxisRange(0));
 101
 102   g.updateOptions({  });
 103   assert.deepEqual([12, 18], g.xAxisRange());
 104   assert.deepEqual([10, 40], g.yAxisRange(0));
 105
 106   g.updateOptions({valueRange : null, axes: {y:{valueRange : [15, 20]}}});
 107   assert.deepEqual([12, 18], g.xAxisRange());
 108   assert.deepEqual([15, 20], g.yAxisRange(0));
 109
 110   g.updateOptions({ dateWindow : null, valueRange : null, axes: null });
 111   assert.deepEqual([10, 20], g.xAxisRange());
 112   assert.deepEqual([0, 55], g.yAxisRange(0));
 113 });
 114
 115 /**
 116  * Verify that when zoomed in by mouse operations, an empty call to
 117  * updateOptions doesn't change the displayed ranges.
 118  */
 119 var zoom = function(g, xRange, yRange) {
 120   var originalXRange = g.xAxisRange();
 121   var originalYRange = g.yAxisRange(0);
 122
 123   DygraphOps.dispatchMouseDown(g, xRange[0], yRange[0]);
 124   DygraphOps.dispatchMouseMove(g, xRange[1], yRange[0]); // this is really necessary.
 125   DygraphOps.dispatchMouseUp(g, xRange[1], yRange[0]);
 126
 127   assertDeepCloseTo(xRange, g.xAxisRange(), 0.2);
 128   // assert.closeTo(originalYRange, g.yAxisRange(0), 0.2); // Not true, it's something in the middle.
 129
 130   var midX = (xRange[1] - xRange[0]) / 2;
 131   DygraphOps.dispatchMouseDown(g, midX, yRange[0]);
 132   DygraphOps.dispatchMouseMove(g, midX, yRange[1]); // this is really necessary.
 133   DygraphOps.dispatchMouseUp(g, midX, yRange[1]);
 134
 135   assertDeepCloseTo(xRange, g.xAxisRange(), 0.2);
 136   assertDeepCloseTo(yRange, g.yAxisRange(0), 0.2);
 137 }
 138
 139
 140 /**
 141  * Verify that when zoomed in by mouse operations, an empty call to
 142  * updateOptions doesn't change the displayed ranges.
 143  */
 144 it('testEmptyUpdateOptions_doesntUnzoom', function() {
 145   var g = createGraph();
 146   zoom(g, [ 11, 18 ], [ 35, 40 ]);
 147
 148   assertDeepCloseTo([11, 18], g.xAxisRange(), 0.1);
 149   assertDeepCloseTo([35, 40], g.yAxisRange(0), 0.2);
 150
 151   g.updateOptions({});
 152
 153   assertDeepCloseTo([11, 18], g.xAxisRange(), 0.1);
 154   assertDeepCloseTo([35, 40], g.yAxisRange(0), 0.2);
 155 });
 156
 157 /**
 158  * Verify that when zoomed in by mouse operations, a call to
 159  * updateOptions({ dateWindow : null, valueRange : null }) fully
 160  * unzooms.
 161  */
 162 it('testRestoreOriginalRanges_viaUpdateOptions', function() {
 163   var g = createGraph();
 164   zoom(g, [ 11, 18 ], [ 35, 40 ]);
 165
 166   g.updateOptions({ dateWindow : null, valueRange : null });
 167
 168   assert.deepEqual([0, 55], g.yAxisRange(0));
 169   assert.deepEqual([10, 20], g.xAxisRange());
 170 });
 171
 172 /**
 173  * Verify that log scale axis range is properly specified.
 174  */
 175 it('testLogScaleExcludesZero', function() {
 176   var g = new Dygraph("graph", FIVE_TO_ONE_THOUSAND, {
 177     logscale: true,
 178     labels: ['X', 'Y']
 179   });
 180   assert.deepEqual([10, 1099], g.yAxisRange(0));
 181
 182   g.updateOptions({ logscale : false });
 183   assert.deepEqual([0, 1099], g.yAxisRange(0));
 184 });
 185
 186 /**
 187  * Verify that includeZero range is properly specified.
 188  */
 189 it('testIncludeZeroIncludesZero', function() {
 190   var g = new Dygraph("graph", [[0, 500], [500, 1000]], {
 191     includeZero: true,
 192     labels: ['X', 'Y']
 193   });
 194   assert.deepEqual([0, 1100], g.yAxisRange(0));
 195
 196   g.updateOptions({ includeZero : false });
 197   assert.deepEqual([450, 1050], g.yAxisRange(0));
 198 });
 199
 200
 201 /**
 202  * Verify that includeZero range is properly specified per axis.
 203  */
 204 it('testIncludeZeroPerAxis', function() {
 205   var g = new Dygraph("graph",
 206     'X,A,B\n'+
 207     '0,50,50\n'+
 208     '50,110,110\n',
 209     {
 210       drawPoints: true,
 211       pointSize:5,
 212       series:{
 213         A: {
 214           axis: 'y',
 215           pointSize: 10
 216         },
 217         B: {
 218           axis: 'y2'
 219         }
 220       },
 221       axes: {
 222         'y2': { includeZero: true }
 223       }
 224     });
 225
 226
 227   assert.deepEqual([44, 116], g.yAxisRange(0));
 228   assert.deepEqual([0, 121], g.yAxisRange(1));
 229
 230   g.updateOptions({
 231     axes: {
 232       'y2': { includeZero: false }
 233     }
 234   });
 235
 236   assert.deepEqual([44, 116], g.yAxisRange(1));
 237 });
 238
 239 /**
 240  * Verify that very large Y ranges don't break things.
 241  */
 242 it('testHugeRange', function() {
 243   var g = new Dygraph("graph", [[0, -1e120], [1, 1e230]], {
 244     includeZero: true,
 245     labels: ['X', 'Y']
 246   });
 247   assert.closeTo(1, -1e229 / g.yAxisRange(0)[0], 0.001);
 248   assert.closeTo(1, 1.1e230 / g.yAxisRange(0)[1], 0.001);
 249 });
 250
 251 /**
 252  * Verify old-style avoidMinZero option.
 253  */
 254 it('testAvoidMinZero', function() {
 255   var g = createGraph({
 256       avoidMinZero: true,
 257     }, ZERO_TO_FIFTY_STEPS, [10, 20], [-5, 55]);
 258 });
 259
 260 /**
 261  * Verify ranges with user-specified padding, implicit avoidMinZero.
 262  */
 263 it('testPaddingAuto', function() {
 264   var g = createGraph({
 265       xRangePad: 42,
 266       yRangePad: 30
 267     }, ZERO_TO_FIFTY_STEPS, [9, 21], [-5, 55]);
 268 });
 269
 270 /**
 271  * Verify auto range with drawAxesAtZero.
 272  */
 273 it('testPaddingAutoAxisAtZero', function() {
 274   var g = createGraph({
 275       drawAxesAtZero: true,
 276     }, ZERO_TO_FIFTY_STEPS, [10, 20], [0, 55]);
 277 });
 278
 279 /**
 280  * Verify user-specified range with padding and drawAxesAtZero options.
 281  * Try explicit range matching the auto range, should have identical results.
 282  */
 283 it('testPaddingRange1', function() {
 284   var g = createGraph({
 285       valueRange: [0, 50],
 286       xRangePad: 42,
 287       yRangePad: 30,
 288       drawAxesAtZero: true
 289     }, ZERO_TO_FIFTY_STEPS, [9, 21], [-5, 55]);
 290 });
 291
 292 /**
 293  * Verify user-specified range with padding and drawAxesAtZero options.
 294  * User-supplied range differs from the auto range.
 295  */
 296 it('testPaddingRange2', function() {
 297   var g = createGraph({
 298       valueRange: [10, 60],
 299       xRangePad: 42,
 300       yRangePad: 30,
 301       drawAxesAtZero: true,
 302     }, ZERO_TO_FIFTY_STEPS, [9, 21], [5, 65]);
 303 });
 304
 305 /**
 306  * Verify drawAxesAtZero and includeZero.
 307  */
 308 it('testPaddingYAtZero', function() {
 309   var g = createGraph({
 310       includeZero: true,
 311       xRangePad: 42,
 312       yRangePad: 30,
 313       drawAxesAtZero: true,
 314     }, [
 315       [-10, 10],
 316       [10, 20],
 317       [30, 50]
 318     ], [-14, 34], [-5, 55]);
 319 });
 320
 321 /**
 322  * Verify logscale, compat mode.
 323  */
 324 it('testLogscaleCompat', function() {
 325   var g = createGraph({
 326       logscale: true
 327     },
 328     [[-10, 10], [10, 10], [30, 1000]],
 329     [-10, 30], [10, 1099]);
 330 });
 331
 332 /**
 333  * Verify logscale, new mode.
 334  */
 335 it('testLogscalePad', function() {
 336   var g = createGraph({
 337       logscale: true,
 338       yRangePad: 30
 339     },
 340     [[-10, 10], [10, 10], [30, 1000]],
 341     [-10, 30], [5.01691, 1993.25801]);
 342 });
 343
 344 /**
 345  * Verify scrolling all-zero region, traditional.
 346  */
 347 it('testZeroScroll', function() {
 348   var g = new Dygraph(
 349       document.getElementById("graph"),
 350       "X,Y\n" +
 351       "1,0\n" +
 352       "8,0\n" +
 353       "9,0.1\n",
 354       {
 355         drawAxesAtZero: true,
 356         animatedZooms: true,
 357         avoidMinZero: true
 358       });
 359 });
 360
 361 /**
 362  * Verify scrolling all-zero region, new-style.
 363  */
 364 it('testZeroScroll2', function() {
 365   var g = new Dygraph(
 366       document.getElementById("graph"),
 367       "X,Y\n" +
 368       "1,0\n" +
 369       "8,0\n" +
 370       "9,0.1\n",
 371       {
 372         animatedZooms: true,
 373         drawAxesAtZero: true,
 374         xRangePad: 4,
 375         yRangePad: 4
 376       });
 377 });
 378
 379 });