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