projects / dygraphs.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Check for new options before updating synchronised graphs (Fixes #760)
[dygraphs.git] / auto_tests / tests / axis_labels.js
diff --git a/auto_tests/tests/axis_labels.js b/auto_tests/tests/axis_labels.js
index d753159..c390392 100644 (file)
--- a/auto_tests/tests/axis_labels.js
+++ b/auto_tests/tests/axis_labels.js
@@ -3,14 +3,16 @@
  *
  * @author dan@dygraphs.com (Dan Vanderkam)
  */
-describe("axis-labels", function() {
 
-beforeEach(function() {
-  document.body.innerHTML = "<div id='graph'></div>";
-});
+import Dygraph from '../../src/dygraph';
+import * as utils from '../../src/dygraph-utils';
+import DEFAULT_ATTRS from '../../src/dygraph-default-attrs';
+import Util from './Util';
+import {assertDeepCloseTo} from './custom_asserts';
 
-afterEach(function() {
-});
+describe("axis-labels", function() {
+
+cleanupAfterEach();
 
 var simpleData =
     "X,Y,Y2\n" +
@@ -74,18 +76,18 @@ it('testSmallRangeNearZero', function() {
 
   var graph = document.getElementById("graph");
   var g = new Dygraph(graph, data, opts);
-  assert.equalsDelta([-0.1,-0.05,0,0.05],
+  assertDeepCloseTo([-0.1,-0.05,0,0.05],
                     Util.makeNumbers(Util.getYLabels()), kCloseFloat);
 
   opts.valueRange = [-0.05, 0.05];
   g.updateOptions(opts);
   assert.deepEqual([-0.04,-0.02,0,0.02,0.04],
-               Util.makeNumbers(Util.getYLabels()));
+                   Util.makeNumbers(Util.getYLabels()));
 
   opts.valueRange = [-0.01, 0.01];
   g.updateOptions(opts);
   assert.deepEqual([-0.01,-0.005,0,0.005],
-               Util.makeNumbers(Util.getYLabels()));
+                   Util.makeNumbers(Util.getYLabels()));
 
   g.setSelection(1);
   assert.equal('1: Y: 0', Util.getLegend());
@@ -125,7 +127,8 @@ it('testSmallRangeAwayFromZero', function() {
 it('testXAxisTimeLabelFormatter', function() {
   var opts = {
     width: 480,
-    height: 320
+    height: 320,
+    labels: ['X', 'Y1']
   };
   var data = [[5.0,0],[5.1,1],[5.2,2],[5.3,3],[5.4,4],[5.5,5],[5.6,6],[5.7,7],[5.8,8],[5.9,9]];
   var graph = document.getElementById("graph");
@@ -203,7 +206,7 @@ it('testDateAxisLabelFormatter', function() {
       x : {
         pixelsPerLabel: 60,
         axisLabelFormatter : function(x, granularity, opts, dg) {
-          assert.isTrue(Dygraph.isDateLike(x));
+          assert.isTrue(utils.isDateLike(x));
           assert.equal('number', typeof(granularity));
           assert.equal('function', typeof(opts));
           assert.equal('[Dygraph graph]', dg.toString());
@@ -593,9 +596,8 @@ it('testLabelKMG2', function() {
     }
   );
 
-  assert.equal(
-      ["0","256","512","768","1k","1.25k","1.5k","1.75k","2k"],
-      Util.getYLabels());
+  assert.deepEqual(["0","256","512","768","1k","1.25k","1.5k","1.75k","2k"],
+                   Util.getYLabels());
 });
 
 // Same as testLabelKMG2 but specifies the option at the
@@ -615,16 +617,69 @@ it('testLabelKMG2_top', function() {
     }
   );
 
-  assert.equal(
+  assert.deepEqual(
       ["0","256","512","768","1k","1.25k","1.5k","1.75k","2k"],
       Util.getYLabels());
 });
 
+it('testSmallLabelKMB', function() {
+  var data = [];
+  data.push([0, 0]);
+  data.push([1, 1e-6]);
+  data.push([2, 2e-6]);
+
+  var g = new Dygraph(
+    document.getElementById("graph"),
+    data,
+    {
+      labels: [ 'X', 'bar' ],
+      axes : {
+        y: {
+          labelsKMB: true
+        }
+      }
+    }
+  );
+
+  // TODO(danvk): use prefixes here (e.g. m, ยต, n)
+  assert.deepEqual(['0', '5.00e-7', '1.00e-6', '1.50e-6', '2.00e-6'],
+                   Util.getYLabels());
+});
+
+it('testSmallLabelKMG2', function() {
+  var data = [];
+  data.push([0, 0]);
+  data.push([1, 1e-6]);
+  data.push([2, 2e-6]);
+
+  var g = new Dygraph(
+    document.getElementById("graph"),
+    data,
+    {
+      labels: [ 'X', 'bar' ],
+      axes : {
+        y: {
+          labelsKMG2: true
+        }
+      }
+    }
+  );
+
+  // TODO(danvk): this is strange--the values aren't on powers of two, and are
+  // these units really used for powers of two in <1? See issue #571.
+  assert.deepEqual(['0', '0.48u', '0.95u', '1.43u', '1.91u'],
+                   Util.getYLabels());
+});
+
 /**
  * Verify that log scale axis range is properly specified.
  */
 it('testLogScale', function() {
-  var g = new Dygraph("graph", [[0, 5], [1, 1000]], { logscale : true });
+  var g = new Dygraph("graph",
+                      [[0, 5], [1, 1000]], {
+                        logscale: true,
+                        labels: ['X', 'Y']
+                      });
   var nonEmptyLabels = Util.getYLabels().filter(function(x) { return x.length > 0; });
   assert.deepEqual(["5","10","20","50","100","200","500","1000"], nonEmptyLabels);
  
@@ -633,10 +688,41 @@ it('testLogScale', function() {
 });
 
 /**
+ * Verify that log scale axis range works with yRangePad.
+ *
+ * This is a regression test for https://github.com/danvk/dygraphs/issues/661 .
+ */
+it('testLogScalePad', function() {
+  var g = new Dygraph("graph",
+                      [[0, 1e-5], [1, 0.25], [2, 1], [3, 3], [4, 10]], {
+                        width: 250,
+                        height: 130,
+                        logscale: true,
+                        yRangePad: 30,
+                        axes: {y: {valueRange: [1, 10]}},
+                        labels: ['X', 'Y']
+                      });
+  var nonEmptyLabels = Util.getYLabels().filter(function(x) { return x.length > 0; });
+  assert.deepEqual(['1', '7', '30'], nonEmptyLabels);
+
+  g.updateOptions({ yRangePad: 10, axes: {y: {valueRange: [0.25005, 3]}} });
+  nonEmptyLabels = Util.getYLabels().filter(function(x) { return x.length > 0; });
+  assert.deepEqual(['0.4', '1', '3'], nonEmptyLabels);
+
+  g.updateOptions({ axes: {y: {valueRange: [0.01, 3]}} });
+  nonEmptyLabels = Util.getYLabels().filter(function(x) { return x.length > 0; });
+  assert.deepEqual(['0.01','0.1','0.7','5'], nonEmptyLabels);
+});
+
+/**
  * Verify that include zero range is properly specified.
  */
 it('testIncludeZero', function() {
-  var g = new Dygraph("graph", [[0, 500], [1, 1000]], { includeZero : true });
+  var g = new Dygraph("graph",
+                      [[0, 500], [1, 1000]], {
+                        includeZero: true,
+                        labels: ['X', 'Y1']
+                      });
   assert.deepEqual(['0','200','400','600','800','1000'], Util.getYLabels());
  
   g.updateOptions({ includeZero : false });
@@ -648,50 +734,50 @@ it('testAxisLabelFontSize', function() {
   var g = new Dygraph(graph, simpleData, {});
 
   // Be sure we're dealing with a 14-point default.
-  assert.equal(14, Dygraph.DEFAULT_ATTRS.axisLabelFontSize);
+  assert.equal(14, DEFAULT_ATTRS.axisLabelFontSize);
 
   var assertFontSize = function(selector, expected) {
     Util.assertStyleOfChildren(selector, "font-size", expected);
   }
-  
-  assertFontSize($(".dygraph-axis-label-x"), "14px");
-  assertFontSize($(".dygraph-axis-label-y") , "14px");
 
-  g.updateOptions({ axisLabelFontSize : 8});
-  assertFontSize($(".dygraph-axis-label-x"), "8px"); 
-  assertFontSize($(".dygraph-axis-label-y"), "8px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-x"), "14px");
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-y"), "14px");
+
+  g.updateOptions({axisLabelFontSize : 8});
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-x"), "8px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-y"), "8px"); 
 
   g.updateOptions({
     axisLabelFontSize : null,
-    axes : { 
-      x : { axisLabelFontSize : 5 },
+    axes: { 
+      x: { axisLabelFontSize : 5 },
     }   
   }); 
 
-  assertFontSize($(".dygraph-axis-label-x"), "5px"); 
-  assertFontSize($(".dygraph-axis-label-y"), "14px");
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-x"), "5px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-y"), "14px");
 
   g.updateOptions({
-    axes : { 
-      y : { axisLabelFontSize : 20 },
+    axes: { 
+      y: { axisLabelFontSize : 20 },
     }   
   }); 
 
-  assertFontSize($(".dygraph-axis-label-x"), "5px"); 
-  assertFontSize($(".dygraph-axis-label-y"), "20px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-x"), "5px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-y"), "20px"); 
 
   g.updateOptions({
-    series : { 
-      Y2 : { axis : "y2" } // copy y2 series to y2 axis.
+    series: { 
+      Y2: { axis : "y2" } // copy y2 series to y2 axis.
     },  
-    axes : { 
-      y2 : { axisLabelFontSize : 12 },
+    axes: { 
+      y2: { axisLabelFontSize : 12 },
     }   
   }); 
 
-  assertFontSize($(".dygraph-axis-label-x"), "5px"); 
-  assertFontSize($(".dygraph-axis-label-y1"), "20px"); 
-  assertFontSize($(".dygraph-axis-label-y2"), "12px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-x"), "5px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-y1"), "20px"); 
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-y2"), "12px"); 
 });
 
 it('testAxisLabelFontSizeNull', function() {
@@ -706,10 +792,10 @@ it('testAxisLabelFontSizeNull', function() {
   };
 
   // Be sure we're dealing with a 14-point default.
-  assert.equal(14, Dygraph.DEFAULT_ATTRS.axisLabelFontSize);
+  assert.equal(14, DEFAULT_ATTRS.axisLabelFontSize);
 
-  assertFontSize($(".dygraph-axis-label-x"), "14px");
-  assertFontSize($(".dygraph-axis-label-y"), "14px");
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-x"), "14px");
+  assertFontSize(document.querySelectorAll(".dygraph-axis-label-y"), "14px");
 });
 
 it('testAxisLabelColor', function() {
@@ -717,18 +803,18 @@ it('testAxisLabelColor', function() {
   var g = new Dygraph(graph, simpleData, {});
 
   // Be sure we're dealing with a black default.
-  assert.equal("black", Dygraph.DEFAULT_ATTRS.axisLabelColor);
+  assert.equal("black", DEFAULT_ATTRS.axisLabelColor);
 
   var assertColor = function(selector, expected) {
     Util.assertStyleOfChildren(selector, "color", expected);
   }
 
-  assertColor($(".dygraph-axis-label-x"), "rgb(0, 0, 0)");
-  assertColor($(".dygraph-axis-label-y"), "rgb(0, 0, 0)");
+  assertColor(document.querySelectorAll(".dygraph-axis-label-x"), "rgb(0, 0, 0)");
+  assertColor(document.querySelectorAll(".dygraph-axis-label-y"), "rgb(0, 0, 0)");
 
   g.updateOptions({ axisLabelColor : "red"});
-  assertColor($(".dygraph-axis-label-x"), "rgb(255, 0, 0)"); 
-  assertColor($(".dygraph-axis-label-y"), "rgb(255, 0, 0)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-x"), "rgb(255, 0, 0)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-y"), "rgb(255, 0, 0)"); 
 
   g.updateOptions({
     axisLabelColor : null,
@@ -737,8 +823,8 @@ it('testAxisLabelColor', function() {
     }   
   }); 
 
-  assertColor($(".dygraph-axis-label-x"), "rgb(0, 0, 255)"); 
-  assertColor($(".dygraph-axis-label-y"), "rgb(0, 0, 0)");
+  assertColor(document.querySelectorAll(".dygraph-axis-label-x"), "rgb(0, 0, 255)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-y"), "rgb(0, 0, 0)");
 
   g.updateOptions({
     axes : { 
@@ -746,8 +832,8 @@ it('testAxisLabelColor', function() {
     }   
   }); 
 
-  assertColor($(".dygraph-axis-label-x"), "rgb(0, 0, 255)"); 
-  assertColor($(".dygraph-axis-label-y"), "rgb(0, 128, 0)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-x"), "rgb(0, 0, 255)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-y"), "rgb(0, 128, 0)"); 
 
   g.updateOptions({
     series : { 
@@ -758,9 +844,9 @@ it('testAxisLabelColor', function() {
     }   
   }); 
 
-  assertColor($(".dygraph-axis-label-x"), "rgb(0, 0, 255)"); 
-  assertColor($(".dygraph-axis-label-y1"), "rgb(0, 128, 0)"); 
-  assertColor($(".dygraph-axis-label-y2"), "rgb(255, 255, 0)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-x"), "rgb(0, 0, 255)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-y1"), "rgb(0, 128, 0)"); 
+  assertColor(document.querySelectorAll(".dygraph-axis-label-y2"), "rgb(255, 255, 0)"); 
 });
 
 it('testAxisLabelColorNull', function() {
@@ -775,10 +861,10 @@ it('testAxisLabelColorNull', function() {
   }
 
   // Be sure we're dealing with a 14-point default.
-  assert.equal(14, Dygraph.DEFAULT_ATTRS.axisLabelFontSize);
+  assert.equal(14, DEFAULT_ATTRS.axisLabelFontSize);
 
-  assertColor($(".dygraph-axis-label-x"), "rgb(0, 0, 0)");
-  assertColor($(".dygraph-axis-label-y"), "rgb(0, 0, 0)");
+  assertColor(document.querySelectorAll(".dygraph-axis-label-x"), "rgb(0, 0, 0)");
+  assertColor(document.querySelectorAll(".dygraph-axis-label-y"), "rgb(0, 0, 0)");
 });
 
 /*
@@ -825,7 +911,7 @@ it('testLabelsKMBPerAxis', function() {
   // labelsKMB doesn't apply to the x axis. This value should be different.
   // BUG : https://code.google.com/p/dygraphs/issues/detail?id=488
   assert.deepEqual(["1000","2000","3000"], Util.getXLabels());
-  assert.equal( ["0","500","1000","1500","2000"], Util.getYLabels(1));
+  assert.deepEqual(["0","500","1000","1500","2000"], Util.getYLabels(1));
   assert.deepEqual(["0","500","1K","1.5K","2K"], Util.getYLabels(2));
 });
 
@@ -855,7 +941,7 @@ it('testLabelsKMBG2IPerAxis', function() {
   // bits of code.
   // BUG : https://code.google.com/p/dygraphs/issues/detail?id=488
   assert.deepEqual(["1024","2048","3072"], Util.getXLabels());
-  assert.equal( ["0","500","1000","1500","2000"], Util.getYLabels(1));
+  assert.deepEqual(["0","500","1000","1500","2000"], Util.getYLabels(1));
   assert.deepEqual(["0","500","1000","1.46k","1.95k"], Util.getYLabels(2));
 });
 
danvk/dygraphs fork supporting touch events