From: Evert Timberg Date: Mon, 22 Jun 2015 23:03:01 +0000 (-0400) Subject: Add userCallback to category scale + demo file X-Git-Tag: 2.0.0-alpha4~67^2~1 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=6110352df8c732dcda28777bdd87abd25ddf74f8;p=thirdparty%2FChart.js.git Add userCallback to category scale + demo file --- diff --git a/samples/line-x-axis-filter.html b/samples/line-x-axis-filter.html new file mode 100644 index 000000000..3b5b82f28 --- /dev/null +++ b/samples/line-x-axis-filter.html @@ -0,0 +1,138 @@ + + + + + Chart with xAxis Filtering + + + + + + +
+ +
+
+
+ + + + + + + + + diff --git a/src/scales/scale.category.js b/src/scales/scale.category.js index 7e861dfd7..2b233048f 100644 --- a/src/scales/scale.category.js +++ b/src/scales/scale.category.js @@ -37,13 +37,24 @@ isHorizontal: function() { return this.options.position == "top" || this.options.position == "bottom"; }, + buildLabels: function(index) { + this.labels = []; + + if (this.options.labels.userCallback) { + this.data.labels.forEach(function(labelString, index) { + this.labels.push(this.options.labels.userCallback(labelString, index)); + }, this); + } else { + this.labels = this.data.labels; + } + }, getPixelForValue: function(value, index, datasetIndex, includeOffset) { // This must be called after fit has been run so that // this.left, this.top, this.right, and this.bottom have been defined if (this.isHorizontal()) { var isRotated = (this.labelRotation > 0); var innerWidth = this.width - (this.paddingLeft + this.paddingRight); - var valueWidth = innerWidth / Math.max((this.data.labels.length - ((this.options.gridLines.offsetGridLines) ? 0 : 1)), 1); + var valueWidth = innerWidth / Math.max((this.labels.length - ((this.options.gridLines.offsetGridLines) ? 0 : 1)), 1); var valueOffset = (valueWidth * index) + this.paddingLeft; if (this.options.gridLines.offsetGridLines && includeOffset) { @@ -52,7 +63,7 @@ return this.left + Math.round(valueOffset); } else { - return this.top + (index * (this.height / this.data.labels.length)); + return this.top + (index * (this.height / this.labels.length)); } }, getPointPixelForValue: function(value, index, datasetIndex) { @@ -90,8 +101,8 @@ var labelFont = helpers.fontString(this.options.labels.fontSize, this.options.labels.fontStyle, this.options.labels.fontFamily); this.ctx.font = labelFont; - var firstWidth = this.ctx.measureText(this.data.labels[0]).width; - var lastWidth = this.ctx.measureText(this.data.labels[this.data.labels.length - 1]).width; + var firstWidth = this.ctx.measureText(this.labels[0]).width; + var lastWidth = this.ctx.measureText(this.labels[this.labels.length - 1]).width; var firstRotated; var lastRotated; @@ -101,7 +112,7 @@ this.labelRotation = 0; if (this.options.display) { - var originalLabelWidth = helpers.longestText(this.ctx, labelFont, this.data.labels); + var originalLabelWidth = helpers.longestText(this.ctx, labelFont, this.labels); var cosRotation; var sinRotation; var firstRotatedWidth; @@ -164,6 +175,7 @@ this.height = maxHeight; } + this.buildLabels(); this.calculateLabelRotation(maxHeight, margins); var minSize = { @@ -172,7 +184,7 @@ }; var labelFont = helpers.fontString(this.options.labels.fontSize, this.options.labels.fontStyle, this.options.labels.fontFamily); - var longestLabelWidth = helpers.longestText(this.ctx, labelFont, this.data.labels); + var longestLabelWidth = helpers.longestText(this.ctx, labelFont, this.labels); // Width if (this.isHorizontal()) { @@ -209,7 +221,7 @@ var yTickEnd = this.options.position == "bottom" ? this.top + 10 : this.bottom; var isRotated = this.labelRotation !== 0; - helpers.each(this.data.labels, function(label, index) { + helpers.each(this.labels, function(label, index) { var xLineValue = this.getPixelForValue(label, index, null, false); // xvalues for grid lines var xLabelValue = this.getPixelForValue(label, index, null, true); // x values for labels (need to consider offsetLabel option)