From b1060f20ecdecbf8388cac672bfd2b239a57869c Mon Sep 17 00:00:00 2001 From: Evert Timberg Date: Sun, 20 Sep 2015 18:59:58 -0400 Subject: [PATCH] Linear scale has labels --- src/scales/scale.linear.js | 51 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 51 insertions(+) diff --git a/src/scales/scale.linear.js b/src/scales/scale.linear.js index 94dd0a3ac..2446be246 100644 --- a/src/scales/scale.linear.js +++ b/src/scales/scale.linear.js @@ -25,6 +25,20 @@ beginAtZero: false, override: null, + // scale label + scaleLabel: { + fontColor: '#666', + fontFamily: 'Helvetica Neue', + fontSize: 12, + fontStyle: 'normal', + + // actual label + labelString: '', + + // display property + show: false, + }, + // label settings labels: { show: true, @@ -379,6 +393,15 @@ minSize.height = maxHeight; // fill all the height } + // Are we showing a label for the scale? + if (this.options.scaleLabel.show) { + if (this.isHorizontal()) { + minSize.height += (this.options.scaleLabel.fontSize * 1.5); + } else { + minSize.width += (this.options.scaleLabel.fontSize * 1.5); + } + } + this.paddingLeft = 0; this.paddingRight = 0; this.paddingTop = 0; @@ -520,6 +543,18 @@ this.ctx.fillText(label, xValue, labelStartY); }, this); } + + if (this.options.scaleLabel.show) { + // Draw the scale label + this.ctx.textAlign = "center"; + this.ctx.textBaseline = 'middle'; + this.ctx.font = helpers.fontString(this.options.scaleLabel.fontSize, this.options.scaleLabel.fontStyle, this.options.scaleLabel.fontFamily); + + var scaleLabelX = this.left + ((this.right - this.left) / 2); // midpoint of the width + var scaleLabelY = this.options.position == 'bottom' ? this.bottom - (this.options.scaleLabel.fontSize / 2) : this.top + (this.options.scaleLabel.fontSize / 2); + + this.ctx.fillText(this.options.scaleLabel.labelString, scaleLabelX, scaleLabelY); + } } else { // Vertical if (this.options.gridLines.show) { @@ -599,6 +634,22 @@ this.ctx.fillText(label, labelStartX, yValue); }, this); } + + if (this.options.scaleLabel.show) { + // Draw the scale label + var scaleLabelX = this.options.position == 'left' ? this.left + (this.options.scaleLabel.fontSize / 2) : this.right - (this.options.scaleLabel.fontSize / 2); + var scaleLabelY = this.top + ((this.bottom - this.top) / 2); + var rotation = this.options.position == 'left' ? -0.5 * Math.PI : 0.5 * Math.PI; + + this.ctx.save(); + this.ctx.translate(scaleLabelX, scaleLabelY); + this.ctx.rotate(rotation); + this.ctx.textAlign = "center"; + this.ctx.font = helpers.fontString(this.options.scaleLabel.fontSize, this.options.scaleLabel.fontStyle, this.options.scaleLabel.fontFamily); + this.ctx.textBaseline = 'middle'; + this.ctx.fillText(this.options.scaleLabel.labelString, 0, 0); + this.ctx.restore(); + } } } }