-// Copyright 2006 Dan Vanderkam (danvdk@gmail.com)
-// All Rights Reserved.
+/**
+ * @license
+ * Copyright 2006 Dan Vanderkam (danvdk@gmail.com)
+ * MIT-licensed (http://opensource.org/licenses/MIT)
+ */
/**
* @fileoverview Based on PlotKit.CanvasRenderer, but modified to meet the
this.annotations = new Array();
this.chartLabels = {};
- this.area = this.computeArea_();
+ this.area = layout.getPlotArea();
this.container.style.position = "relative";
this.container.style.width = this.width + "px";
return this.dygraph_.attr_(x);
};
-// Compute the box which the chart should be drawn in. This is the canvas's
-// box, less space needed for axis and chart labels.
-// TODO(danvk): this belongs in DygraphLayout.
-DygraphCanvasRenderer.prototype.computeArea_ = function() {
- var area = {
- // TODO(danvk): per-axis setting.
- x: 0,
- y: 0
- };
- if (this.attr_('drawYAxis')) {
- area.x = this.attr_('yAxisLabelWidth') + 2 * this.attr_('axisTickSize');
- }
-
- area.w = this.width - area.x - this.attr_('rightGap');
- area.h = this.height;
- if (this.attr_('drawXAxis')) {
- if (this.attr_('xAxisHeight')) {
- area.h -= this.attr_('xAxisHeight');
- } else {
- area.h -= this.attr_('axisLabelFontSize') + 2 * this.attr_('axisTickSize');
- }
- }
-
- // Shrink the drawing area to accomodate additional y-axes.
- if (this.dygraph_.numAxes() == 2) {
- // TODO(danvk): per-axis setting.
- area.w -= (this.attr_('yAxisLabelWidth') + 2 * this.attr_('axisTickSize'));
- } else if (this.dygraph_.numAxes() > 2) {
- this.dygraph_.error("Only two y-axes are supported at this time. (Trying " +
- "to use " + this.dygraph_.numAxes() + ")");
- }
-
- // Add space for chart labels: title, xlabel and ylabel.
- if (this.attr_('title')) {
- area.h -= this.attr_('titleHeight');
- area.y += this.attr_('titleHeight');
- }
- if (this.attr_('xlabel')) {
- area.h -= this.attr_('xLabelHeight');
- }
- if (this.attr_('ylabel')) {
- // It would make sense to shift the chart here to make room for the y-axis
- // label, but the default yAxisLabelWidth is large enough that this results
- // in overly-padded charts. The y-axis label should fit fine. If it
- // doesn't, the yAxisLabelWidth option can be increased.
- }
-
- return area;
-};
-
DygraphCanvasRenderer.prototype.clear = function() {
if (this.isIE) {
// VML takes a while to start up, so we just poll every this.IEDelay
// Do the ordinary rendering, as before
this._renderLineChart();
this._renderAxis();
- this._renderChartLabels();
+ this._renderChartLabels();
this._renderAnnotations();
};
color: this.attr_('axisLabelColor'),
width: this.attr_('axisLabelWidth') + "px",
// height: this.attr_('axisLabelFontSize') + 2 + "px",
+ lineHeight: "normal", // Something other than "normal" line-height screws up label positioning.
overflow: "hidden"
};
- var makeDiv = function(txt, axis) {
+ var makeDiv = function(txt, axis, prec_axis) {
var div = document.createElement("div");
for (var name in labelStyle) {
if (labelStyle.hasOwnProperty(name)) {
}
}
var inner_div = document.createElement("div");
- // TODO(danvk): separate class for secondary y-axis
- inner_div.className = 'dygraph-axis-label dygraph-axis-label-' + axis;
+ inner_div.className = 'dygraph-axis-label' +
+ ' dygraph-axis-label-' + axis +
+ (prec_axis ? ' dygraph-axis-label-' + prec_axis : '');
inner_div.appendChild(document.createTextNode(txt));
div.appendChild(inner_div);
return div;
if (this.attr_('drawYAxis')) {
if (this.layout.yticks && this.layout.yticks.length > 0) {
+ var num_axes = this.dygraph_.numAxes();
for (var i = 0; i < this.layout.yticks.length; i++) {
var tick = this.layout.yticks[i];
if (typeof(tick) == "function") return;
var x = this.area.x;
var sgn = 1;
+ var prec_axis = 'y1';
if (tick[0] == 1) { // right-side y-axis
x = this.area.x + this.area.w;
sgn = -1;
+ prec_axis = 'y2';
}
var y = this.area.y + tick[1] * this.area.h;
context.beginPath();
context.closePath();
context.stroke();
- var label = makeDiv(tick[2], 'y');
+ var label = makeDiv(tick[2], 'y', num_axes == 2 ? prec_axis : null);
var top = (y - this.attr_('axisLabelFontSize') / 2);
if (top < 0) top = 0;
var isNullOrNaN = function(x) {
return (x === null || isNaN(x));
};
-
+
// TODO(danvk): use this.attr_ for many of these.
var context = this.elementContext;
var fillAlpha = this.attr_('fillAlpha');