var tickWidth = (function() {
var min = xScale.getPixelForTick(1) - xScale.getPixelForTick(0);
- for (var i = 2; i < this.getDataset().data.length; i++) {
+ for (var i = 2; i < xScale.ticks.length; i++) {
min = Math.min(xScale.getPixelForTick(i) - xScale.getPixelForTick(i - 1), min);
}
return min;
// including horizontalBar in the bar file, instead of a file of its own
// it extends bar (like pie extends doughnut)
- Chart.defaults.horizontalBar = {\r
- hover: {\r
- mode: "label"\r
+ Chart.defaults.horizontalBar = {
+ hover: {
+ mode: "label"
},
- scales: {\r
- xAxes: [{\r
+ scales: {
+ xAxes: [{
type: "linear",
- position: "bottom"\r
- }],\r
- yAxes: [{\r
+ position: "bottom"
+ }],
+ yAxes: [{
position: "left",
type: "category",
barPercentage: 0.9,
// grid line settings
- gridLines: {\r
- offsetGridLines: true\r
- }\r
+ gridLines: {
+ offsetGridLines: true
+ }
}]
- },\r
+ },
};
- Chart.controllers.horizontalBar = Chart.controllers.bar.extend({\r
- updateElement: function updateElement(rectangle, index, reset, numBars) {\r
+ Chart.controllers.horizontalBar = Chart.controllers.bar.extend({
+ updateElement: function updateElement(rectangle, index, reset, numBars) {
var meta = this.getMeta();
var xScale = this.getScaleForId(meta.xAxisID);
var yScale = this.getScaleForId(meta.yAxisID);
if (xScale.min < 0 && xScale.max < 0) {
// all less than 0. use the right
- xScalePoint = xScale.getPixelForValue(xScale.max);\r
- } else if (xScale.min > 0 && xScale.max > 0) {\r
- xScalePoint = xScale.getPixelForValue(xScale.min);\r
- } else {\r
- xScalePoint = xScale.getPixelForValue(0);\r
+ xScalePoint = xScale.getPixelForValue(xScale.max);
+ } else if (xScale.min > 0 && xScale.max > 0) {
+ xScalePoint = xScale.getPixelForValue(xScale.min);
+ } else {
+ xScalePoint = xScale.getPixelForValue(0);
}
helpers.extend(rectangle, {
_index: index,
// Desired view properties
- _model: {\r
+ _model: {
x: reset ? xScalePoint : this.calculateBarX(index, this.index),
y: this.calculateBarY(index, this.index),
backgroundColor: rectangle.custom && rectangle.custom.backgroundColor ? rectangle.custom.backgroundColor : helpers.getValueAtIndexOrDefault(this.getDataset().backgroundColor, index, this.chart.options.elements.rectangle.backgroundColor),
borderSkipped: rectangle.custom && rectangle.custom.borderSkipped ? rectangle.custom.borderSkipped : this.chart.options.elements.rectangle.borderSkipped,
borderColor: rectangle.custom && rectangle.custom.borderColor ? rectangle.custom.borderColor : helpers.getValueAtIndexOrDefault(this.getDataset().borderColor, index, this.chart.options.elements.rectangle.borderColor),
- borderWidth: rectangle.custom && rectangle.custom.borderWidth ? rectangle.custom.borderWidth : helpers.getValueAtIndexOrDefault(this.getDataset().borderWidth, index, this.chart.options.elements.rectangle.borderWidth)\r
+ borderWidth: rectangle.custom && rectangle.custom.borderWidth ? rectangle.custom.borderWidth : helpers.getValueAtIndexOrDefault(this.getDataset().borderWidth, index, this.chart.options.elements.rectangle.borderWidth)
},
- draw: function () {\r
+ draw: function () {
var ctx = this._chart.ctx;
var vm = this._view;
// Canvas doesn't allow us to stroke inside the width so we can
// adjust the sizes to fit if we're setting a stroke on the line
- if (vm.borderWidth) {\r
+ if (vm.borderWidth) {
topY += halfStroke;
bottomY -= halfStroke;
- right += halfStroke;\r
+ right += halfStroke;
}
ctx.beginPath();
if (startCorner === -1)
startCorner = 0;
- function cornerAt(index) {\r
- return corners[(startCorner + index) % 4];\r
+ function cornerAt(index) {
+ return corners[(startCorner + index) % 4];
}
// Draw rectangle from 'startCorner'
ctx.lineTo.apply(ctx, cornerAt(i));
ctx.fill();
- if (vm.borderWidth) {\r
- ctx.stroke();\r
- }\r
+ if (vm.borderWidth) {
+ ctx.stroke();
+ }
},
- inRange: function (mouseX, mouseY) {\r
+ inRange: function (mouseX, mouseY) {
var vm = this._view;
var inRange = false;
- if (vm) {\r
- if (vm.x < vm.base) {\r
- inRange = (mouseY >= vm.y - vm.height / 2 && mouseY <= vm.y + vm.height / 2) && (mouseX >= vm.x && mouseX <= vm.base);\r
- } else {\r
- inRange = (mouseY >= vm.y - vm.height / 2 && mouseY <= vm.y + vm.height / 2) && (mouseX >= vm.base && mouseX <= vm.x);\r
- }\r
+ if (vm) {
+ if (vm.x < vm.base) {
+ inRange = (mouseY >= vm.y - vm.height / 2 && mouseY <= vm.y + vm.height / 2) && (mouseX >= vm.x && mouseX <= vm.base);
+ } else {
+ inRange = (mouseY >= vm.y - vm.height / 2 && mouseY <= vm.y + vm.height / 2) && (mouseX >= vm.base && mouseX <= vm.x);
+ }
}
- return inRange;\r
- }\r
+ return inRange;
+ }
});
- rectangle.pivot();\r
+ rectangle.pivot();
},
- calculateBarBase: function (datasetIndex, index) {\r
+ calculateBarBase: function (datasetIndex, index) {
var meta = this.getMeta();
var xScale = this.getScaleForId(meta.xAxisID);
var yScale = this.getScaleForId(meta.yAxisID);
var base = 0;
- if (xScale.options.stacked) {\r
+ if (xScale.options.stacked) {
var value = this.chart.data.datasets[datasetIndex].data[index];
- if (value < 0) {\r
- for (var i = 0; i < datasetIndex; i++) {\r
+ if (value < 0) {
+ for (var i = 0; i < datasetIndex; i++) {
var negDS = this.chart.data.datasets[i];
var negDSMeta = this.chart.getDatasetMeta(i);
- if (negDSMeta.bar && negDSMeta.xAxisID === xScale.id && this.chart.isDatasetVisible(i)) {\r
- base += negDS.data[index] < 0 ? negDS.data[index] : 0;\r
- }\r
- }\r
- } else {\r
- for (var j = 0; j < datasetIndex; j++) {\r
+ if (negDSMeta.bar && negDSMeta.xAxisID === xScale.id && this.chart.isDatasetVisible(i)) {
+ base += negDS.data[index] < 0 ? negDS.data[index] : 0;
+ }
+ }
+ } else {
+ for (var j = 0; j < datasetIndex; j++) {
var posDS = this.chart.data.datasets[j];
var posDSMeta = this.chart.getDatasetMeta(j);
- if (posDSMeta.bar && posDSMeta.xAxisID === xScale.id && this.chart.isDatasetVisible(j)) {\r
- base += posDS.data[index] > 0 ? posDS.data[index] : 0;\r
- }\r
- }\r
+ if (posDSMeta.bar && posDSMeta.xAxisID === xScale.id && this.chart.isDatasetVisible(j)) {
+ base += posDS.data[index] > 0 ? posDS.data[index] : 0;
+ }
+ }
}
- return xScale.getPixelForValue(base);\r
+ return xScale.getPixelForValue(base);
}
base = xScale.getPixelForValue(xScale.min);
- if (xScale.beginAtZero || ((xScale.min <= 0 && xScale.max >= 0) || (xScale.min >= 0 && xScale.max <= 0))) {\r
- base = xScale.getPixelForValue(0, 0);\r
+ if (xScale.beginAtZero || ((xScale.min <= 0 && xScale.max >= 0) || (xScale.min >= 0 && xScale.max <= 0))) {
+ base = xScale.getPixelForValue(0, 0);
} else if (xScale.min < 0 && xScale.max < 0) {
// All values are negative. Use the right as the base
- base = xScale.getPixelForValue(xScale.max);\r
+ base = xScale.getPixelForValue(xScale.max);
}
- return base;\r
+ return base;
},
- getRuler: function () {\r
+ getRuler: function () {
var meta = this.getMeta();
var xScale = this.getScaleForId(meta.xAxisID);
var yScale = this.getScaleForId(meta.yAxisID);
var datasetCount = this.getBarCount();
- var tickHeight = (function () {\r
+ var tickHeight = (function () {
var min = yScale.getPixelForTick(1) - yScale.getPixelForTick(0);
- for (var i = 2; i < this.getDataset().data.length; i++) {\r
- min = Math.min(yScale.getPixelForTick(i) - yScale.getPixelForTick(i - 1), min);\r
+ for (var i = 2; i < this.getDataset().data.length; i++) {
+ min = Math.min(yScale.getPixelForTick(i) - yScale.getPixelForTick(i - 1), min);
}
- return min;\r
+ return min;
}).call(this);
var categoryHeight = tickHeight * yScale.options.categoryPercentage;
var categorySpacing = (tickHeight - (tickHeight * yScale.options.categoryPercentage)) / 2;
var fullBarHeight = categoryHeight / datasetCount;
- if (yScale.ticks.length !== this.chart.data.labels.length) {\r
+ if (yScale.ticks.length !== this.chart.data.labels.length) {
var perc = yScale.ticks.length / this.chart.data.labels.length;
- fullBarHeight = fullBarHeight * perc;\r
+ fullBarHeight = fullBarHeight * perc;
}
var barHeight = fullBarHeight * yScale.options.barPercentage;
var barSpacing = fullBarHeight - (fullBarHeight * yScale.options.barPercentage);
- return {\r
+ return {
datasetCount: datasetCount,
tickHeight: tickHeight,
categoryHeight: categoryHeight,
categorySpacing: categorySpacing,
fullBarHeight: fullBarHeight,
barHeight: barHeight,
- barSpacing: barSpacing,\r
- };\r
+ barSpacing: barSpacing,
+ };
},
- calculateBarHeight: function () {\r
+ calculateBarHeight: function () {
var yScale = this.getScaleForId(this.getMeta().yAxisID);
var ruler = this.getRuler();
- return yScale.options.stacked ? ruler.categoryHeight : ruler.barHeight;\r
+ return yScale.options.stacked ? ruler.categoryHeight : ruler.barHeight;
},
- calculateBarX: function (index, datasetIndex) {\r
+ calculateBarX: function (index, datasetIndex) {
var meta = this.getMeta();
var xScale = this.getScaleForId(meta.xAxisID);
var yScale = this.getScaleForId(meta.yAxisID);
var value = this.getDataset().data[index];
- if (xScale.options.stacked) {\r
-\r
+ if (xScale.options.stacked) {
+
var sumPos = 0,
sumNeg = 0;
- for (var i = 0; i < datasetIndex; i++) {\r
+ for (var i = 0; i < datasetIndex; i++) {
var ds = this.chart.data.datasets[i];
var dsMeta = this.chart.getDatasetMeta(i);
- if (dsMeta.bar && dsMeta.xAxisID === xScale.id && this.chart.isDatasetVisible(i)) {\r
- if (ds.data[index] < 0) {\r
- sumNeg += ds.data[index] || 0;\r
- } else {\r
- sumPos += ds.data[index] || 0;\r
- }\r
- }\r
+ if (dsMeta.bar && dsMeta.xAxisID === xScale.id && this.chart.isDatasetVisible(i)) {
+ if (ds.data[index] < 0) {
+ sumNeg += ds.data[index] || 0;
+ } else {
+ sumPos += ds.data[index] || 0;
+ }
+ }
}
- if (value < 0) {\r
- return xScale.getPixelForValue(sumNeg + value);\r
- } else {\r
- return xScale.getPixelForValue(sumPos + value);\r
+ if (value < 0) {
+ return xScale.getPixelForValue(sumNeg + value);
+ } else {
+ return xScale.getPixelForValue(sumPos + value);
}
}
- return xScale.getPixelForValue(value);\r
+ return xScale.getPixelForValue(value);
},
- calculateBarY: function (index, datasetIndex) {\r
+ calculateBarY: function (index, datasetIndex) {
var meta = this.getMeta();
var yScale = this.getScaleForId(meta.yAxisID);
var xScale = this.getScaleForId(meta.xAxisID);
var topTick = yScale.getPixelForValue(null, index, datasetIndex, this.chart.isCombo);
topTick -= this.chart.isCombo ? (ruler.tickHeight / 2) : 0;
- if (yScale.options.stacked) {\r
- return topTick + (ruler.categoryHeight / 2) + ruler.categorySpacing;\r
+ if (yScale.options.stacked) {
+ return topTick + (ruler.categoryHeight / 2) + ruler.categorySpacing;
}
return topTick +
ruler.categorySpacing +
(ruler.barHeight * barIndex) +
(ruler.barSpacing / 2) +
- (ruler.barSpacing * barIndex);\r
- }\r
+ (ruler.barSpacing * barIndex);
+ }
});
};