From 4dd0ac55dc5074a6a935a9174a34ca5e04dcaae3 Mon Sep 17 00:00:00 2001 From: Russell Valentine Date: Wed, 18 Jan 2012 17:16:04 -0500 Subject: [PATCH] Per y-axis valueRange support. --- auto_tests/tests/multiple_axes.js | 48 +++++++++++++++ auto_tests/tests/range_tests.js | 6 +- auto_tests/tests/sanity.js | 12 +++- dygraph-options-reference.js | 2 +- dygraph.js | 22 ++++++- tests/two-axes-vr.html | 123 ++++++++++++++++++++++++++++++++++++++ 6 files changed, 207 insertions(+), 6 deletions(-) create mode 100644 tests/two-axes-vr.html diff --git a/auto_tests/tests/multiple_axes.js b/auto_tests/tests/multiple_axes.js index bf75876..05e93c7 100644 --- a/auto_tests/tests/multiple_axes.js +++ b/auto_tests/tests/multiple_axes.js @@ -243,3 +243,51 @@ MultipleAxesTestCase.prototype.testNoY2LabelWithoutSecondaryAxis = function() { assertEquals(["y-axis"], getClassTexts("dygraph-ylabel")); assertEquals([], getClassTexts("dygraph-y2label")); }; + +MultipleAxesTestCase.prototype.testValueRangePerAxisOptions = function() { + var data = MultipleAxesTestCase.getData(); + + g = new Dygraph( + document.getElementById("graph"), + data, + { + labels: [ 'Date', 'Y1', 'Y2', 'Y3', 'Y4' ], + 'Y3': { + axis: { + } + }, + 'Y4': { + axis: 'Y3' // use the same y-axis as series Y3 + }, + axes: { + y: { + valueRange: [40, 70] + }, + y2: { + // set axis-related properties here + labelsKMB: true + } + }, + ylabel: 'Primary y-axis', + y2label: 'Secondary y-axis', + yAxisLabelWidth: 60 + } + ); + assertEquals(["40", "45", "50", "55", "60", "65"], getYLabelsForAxis("1")); + assertEquals(["900K","1.1M","1.3M","1.5M","1.7M","1.9M"], getYLabelsForAxis("2")); + + g.updateOptions( + { + axes: { + y: { + valueRange: [40, 80] + }, + y2: { + valueRange: [1e6, 1.2e6] + } + } + } + ); + assertEquals(["40", "45", "50", "55", "60", "65", "70", "75"], getYLabelsForAxis("1")); + assertEquals(["1M", "1.02M", "1.05M", "1.08M", "1.1M", "1.13M", "1.15M", "1.18M"], getYLabelsForAxis("2")); +}; \ No newline at end of file diff --git a/auto_tests/tests/range_tests.js b/auto_tests/tests/range_tests.js index 32c511e..c92c489 100644 --- a/auto_tests/tests/range_tests.js +++ b/auto_tests/tests/range_tests.js @@ -70,8 +70,12 @@ RangeTestCase.prototype.testRangeSetOperations = function() { g.updateOptions({ }); assertEquals([12, 18], g.xAxisRange()); assertEquals([10, 40], g.yAxisRange(0)); + + g.updateOptions({valueRange : null, axes: {y:{valueRange : [15, 20]}}}); + assertEquals([12, 18], g.xAxisRange()); + assertEquals([15, 20], g.yAxisRange(0)); - g.updateOptions({ dateWindow : null, valueRange : null }); + g.updateOptions({ dateWindow : null, valueRange : null, axes: null }); assertEquals([10, 20], g.xAxisRange()); assertEquals([0, 55], g.yAxisRange(0)); }; diff --git a/auto_tests/tests/sanity.js b/auto_tests/tests/sanity.js index 528b7a1..95a1aa2 100644 --- a/auto_tests/tests/sanity.js +++ b/auto_tests/tests/sanity.js @@ -80,6 +80,8 @@ SanityTestCase.prototype.testYAxisRange_custom = function() { var graph = document.getElementById("graph"); var g = new Dygraph(graph, ZERO_TO_FIFTY, { valueRange: [0,50] }); assertEquals([0, 50], g.yAxisRange(0)); + g.updateOptions({valueRange: null, axes: {y: {valueRange: [10, 40]}}}); + assertEquals([10, 40], g.yAxisRange(0)); }; /** @@ -95,7 +97,15 @@ SanityTestCase.prototype.testToDomYCoord = function() { assertEquals(50, g.toDomYCoord(0)); assertEquals(0, g.toDomYCoord(50)); - + + for (var x = 0; x <= 50; x++) { + assertEqualsDelta(50 - x, g.toDomYCoord(x), 0.00001); + } + g.updateOptions({valueRange: null, axes: {y: {valueRange: [0, 50]}}}); + + assertEquals(50, g.toDomYCoord(0)); + assertEquals(0, g.toDomYCoord(50)); + for (var x = 0; x <= 50; x++) { assertEqualsDelta(50 - x, g.toDomYCoord(x), 0.00001); } diff --git a/dygraph-options-reference.js b/dygraph-options-reference.js index 92846ee..fec5254 100644 --- a/dygraph-options-reference.js +++ b/dygraph-options-reference.js @@ -298,7 +298,7 @@ Dygraph.OPTIONS_REFERENCE = // "labels": ["Axis display"], "type": "Array of two numbers", "example": "[10, 110]", - "description": "Explicitly set the vertical range of the graph to [low, high]." + "description": "Explicitly set the vertical range of the graph to [low, high]. This may be set on a per-axis basis to define each y-axis separately." }, "labelsDivWidth": { "default": "250", diff --git a/dygraph.js b/dygraph.js index 66432f7..79f6d53 100644 --- a/dygraph.js +++ b/dygraph.js @@ -2090,7 +2090,7 @@ Dygraph.prototype.renderGraph_ = function(is_initial_draw, clearSelection) { Dygraph.prototype.computeYAxes_ = function() { // Preserve valueWindow settings if they exist, and if the user hasn't // specified a new valueRange. - var i, valueWindows, seriesName, axis, index; + var i, valueWindows, seriesName, axis, index, opts, v; if (this.axes_ !== undefined && this.user_attrs_.hasOwnProperty("valueRange") === false) { valueWindows = []; for (index = 0; index < this.axes_.length; index++) { @@ -2122,7 +2122,7 @@ Dygraph.prototype.computeYAxes_ = function() { // Copy global axis options over to the first axis. for (i = 0; i < axisOptions.length; i++) { var k = axisOptions[i]; - var v = this.attr_(k); + v = this.attr_(k); if (v) this.axes_[0][k] = v; } @@ -2136,7 +2136,7 @@ Dygraph.prototype.computeYAxes_ = function() { } if (typeof(axis) == 'object') { // Add a new axis, making a copy of its per-axis options. - var opts = {}; + opts = {}; Dygraph.update(opts, this.axes_[0]); Dygraph.update(opts, { valueRange: null }); // shouldn't inherit this. var yAxisId = this.axes_.length; @@ -2170,6 +2170,22 @@ Dygraph.prototype.computeYAxes_ = function() { this.axes_[index].valueWindow = valueWindows[index]; } } + + // New axes options + for (axis = 0; axis < this.axes_.length; axis++) { + if (axis === 0) { + opts = this.optionsViewForAxis_('y' + (axis ? '2' : '')); + v = opts("valueRange"); + if (v) this.axes_[axis].valueRange = v; + } else { // To keep old behavior + var axes = this.user_attrs_.axes; + if (axes && axes.y2) { + v = axes.y2.valueRange; + if (v) this.axes_[axis].valueRange = v; + } + } + } + }; /** diff --git a/tests/two-axes-vr.html b/tests/two-axes-vr.html new file mode 100644 index 0000000..5814435 --- /dev/null +++ b/tests/two-axes-vr.html @@ -0,0 +1,123 @@ + + + + + Multiple y-axes with valueRange + + + + + + +

Multiple y-axes with valueRange

+

The same data with both different valueRanges. Two-axis old y[40, 70] valueRange:

+
+

Two-axis new valueRange y[40, 80] set:

+
+

Two-axis new valueRange y[40, 80] & y2[1e6, 1.2e6] set:

+
+ + + -- 2.7.4