From 70be5ed17a59b006aa1ee34cec86c1623dd2bd61 Mon Sep 17 00:00:00 2001 From: Adam Vartanian Date: Fri, 16 Sep 2011 19:58:10 -0400 Subject: [PATCH] Change DygraphLayout so it calculates the plot area when its requested rather than at construction. The layout is constructed before axis information has been parsed, so it always assumes there's only one axis and never learns otherwise. Update test to show a border around the div bounding box. Prior to the fix, the second axis would clearly extend beyond the box. --- dygraph-canvas.js | 2 +- dygraph-layout.js | 5 ++++- dygraph-range-selector.js | 2 +- tests/two-axes.html | 8 ++------ 4 files changed, 8 insertions(+), 9 deletions(-) diff --git a/dygraph-canvas.js b/dygraph-canvas.js index f4140e6..d4b088e 100644 --- a/dygraph-canvas.js +++ b/dygraph-canvas.js @@ -44,7 +44,7 @@ DygraphCanvasRenderer = function(dygraph, element, elementContext, layout) { this.annotations = new Array(); this.chartLabels = {}; - this.area = layout.plotArea; + this.area = layout.getPlotArea(); this.container.style.position = "relative"; this.container.style.width = this.width + "px"; diff --git a/dygraph-layout.js b/dygraph-layout.js index 915d235..5fd6e52 100644 --- a/dygraph-layout.js +++ b/dygraph-layout.js @@ -30,7 +30,6 @@ DygraphLayout = function(dygraph) { this.datasets = new Array(); this.annotations = new Array(); this.yAxes_ = null; - this.plotArea = this.computePlotArea_(); // TODO(danvk): it's odd that xTicks_ and yTicks_ are inputs, but xticks and // yticks are outputs. Clean this up. @@ -46,6 +45,10 @@ DygraphLayout.prototype.addDataset = function(setname, set_xy) { this.datasets[setname] = set_xy; }; +DygraphLayout.prototype.getPlotArea = function() { + return this.computePlotArea_(); +} + // Compute the box which the chart should be drawn in. This is the canvas's // box, less space needed for axis and chart labels. DygraphLayout.prototype.computePlotArea_ = function() { diff --git a/dygraph-range-selector.js b/dygraph-range-selector.js index 05a5c65..5e0d218 100644 --- a/dygraph-range-selector.js +++ b/dygraph-range-selector.js @@ -77,7 +77,7 @@ DygraphRangeSelector.prototype.resize_ = function() { canvas.style.height = canvas.height + 'px'; // for IE }; - var plotArea = this.layout_.plotArea; + var plotArea = this.layout_.getPlotArea(); var xAxisLabelHeight = this.attr_('axisLabelFontSize') + 2 * this.attr_('axisTickSize'); this.canvasRect_ = { x: plotArea.x, diff --git a/tests/two-axes.html b/tests/two-axes.html index d1c876b..834fd2f 100644 --- a/tests/two-axes.html +++ b/tests/two-axes.html @@ -16,9 +16,9 @@

Multiple y-axes

The same data with both one and two y-axes. Two y-axes:

A single y-axis: