Mirrors/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2024-10-07 04:39:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

Category scale has labels

Browse Source
This commit is contained in:
Evert Timberg 2015-09-20 19:18:59 -04:00
parent 9fecb37e30
commit b7c7f1d6a4
1 changed files with 55 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/scales/scale.category.js
View File

@ -22,6 +22,20 @@
offsetGridLines: false, offsetGridLines: false,
}, },
// scale label
scaleLabel: {
fontColor: '#666',
fontFamily: 'Helvetica Neue',
fontSize: 12,
fontStyle: 'normal',
// actual label
labelString: '',
// display property
show: false,
},
// label settings // label settings
labels: { labels: {
show: true, show: true,
@ -185,6 +199,15 @@
height: 0, height: 0,
}; };
// 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);
}
}
var labelFont = helpers.fontString(this.options.labels.fontSize, this.options.labels.fontStyle, this.options.labels.fontFamily); var labelFont = helpers.fontString(this.options.labels.fontSize, this.options.labels.fontStyle, this.options.labels.fontFamily);
var longestLabelWidth = helpers.longestText(this.ctx, labelFont, this.labels); var longestLabelWidth = helpers.longestText(this.ctx, labelFont, this.labels);
@ -193,13 +216,15 @@
minSize.width = maxWidth; minSize.width = maxWidth;
} else if (this.options.display) { } else if (this.options.display) {
var labelWidth = this.options.labels.show ? longestLabelWidth + 6 : 0; var labelWidth = this.options.labels.show ? longestLabelWidth + 6 : 0;
minSize.width = Math.min(labelWidth, maxWidth); minSize.width += labelWidth;
minSize.width = Math.min(minSize.width, maxWidth);
} }
// Height // Height
if (this.isHorizontal() && this.options.display) { if (this.isHorizontal() && this.options.display) {
var labelHeight = (Math.sin(helpers.toRadians(this.labelRotation)) * longestLabelWidth) + 1.5 * this.options.labels.fontSize; var labelHeight = (Math.sin(helpers.toRadians(this.labelRotation)) * longestLabelWidth) + 1.5 * this.options.labels.fontSize;
minSize.height = Math.min(this.options.labels.show ? labelHeight : 0, maxHeight); minSize.height += this.options.labels.show ? labelHeight : 0;
minSize.height = Math.min(minSize.height, maxHeight);
} else if (this.options.display) { } else if (this.options.display) {
minSize.height = maxHeight; minSize.height = maxHeight;
} }
@ -280,6 +305,18 @@
this.ctx.restore(); this.ctx.restore();
} }
}, this); }, 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 { } else {
// Vertical // Vertical
if (this.options.gridLines.show) {} if (this.options.gridLines.show) {}
@ -287,6 +324,22 @@
if (this.options.labels.show) { if (this.options.labels.show) {
// Draw the labels // Draw the labels
} }
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();
}
} }
} }
} }