archive-gh-me/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2025-12-08 20:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Always include padding to ensure that we can always see the tick labels of vertical axes

Browse Source
This commit is contained in:
Evert Timberg 2015-11-13 13:24:22 -05:00
parent fff13f2692
commit 7f34d8dd2f
5 changed files with 62 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/core/core.scale.js
View File

@ -259,6 +259,8 @@
// A horizontal axis is more constrained by the height.
var maxLabelHeight = this.maxHeight - this.minSize.height;
var longestLabelWidth = helpers.longestText(this.ctx, labelFont, this.ticks);
// TODO - improve this calculation
var labelHeight = (Math.sin(helpers.toRadians(this.labelRotation)) * longestLabelWidth) + 1.5 * this.options.ticks.fontSize;
this.minSize.height = Math.min(this.maxHeight, this.minSize.height + labelHeight);
@ -280,6 +282,11 @@
var maxLabelWidth = this.maxWidth - this.minSize.width;
var largestTextWidth = helpers.longestText(this.ctx, labelFont, this.ticks);
// Account for padding
if (!this.options.ticks.mirror) {
largestTextWidth += this.options.ticks.padding;
}
if (largestTextWidth < maxLabelWidth) {
// We don't need all the room
this.minSize.width += largestTextWidth;

4
test/controller.bar.tests.js
View File

@ -262,7 +262,7 @@ describe('Bar controller tests', function() {
expect(bar1._xScale).toBe(chart.scales.firstXScaleID);
expect(bar1._yScale).toBe(chart.scales.firstYScaleID);
expect(bar1._model).toEqual({
x: 103.60000000000001,
x: 113.60000000000001,
y: 194,
label: 'label1',
datasetLabel: 'dataset2',
@ -279,7 +279,7 @@ describe('Bar controller tests', function() {
expect(bar2._xScale).toBe(chart.scales.firstXScaleID);
expect(bar2._yScale).toBe(chart.scales.firstYScaleID);
expect(bar2._model).toEqual({
x: 141.6,
x: 151.60000000000002,
y: 6,
label: 'label2',
datasetLabel: 'dataset2',

54
test/controller.line.tests.js
View File

@ -267,13 +267,13 @@ describe('Line controller tests', function() {
tension: 0.1,
// Point
x: 71,
x: 81,
y: 62,
// Control points
controlPointPreviousX: 71,
controlPointPreviousX: 81,
controlPointPreviousY: 62,
controlPointNextX: 76,
controlPointNextX: 86,
controlPointNextY: 57.3,
});
@ -287,13 +287,13 @@ describe('Line controller tests', function() {
tension: 0.1,
// Point
x: 121,
x: 131,
y: 15,
// Control points
controlPointPreviousX: 117.82889384189087,
controlPointPreviousX: 127.82889384189087,
controlPointPreviousY: 12.04867347661131,
controlPointNextX: 127.92889384189088,
controlPointNextX: 137.92889384189088,
controlPointNextY: 21.44867347661131,
});
@ -307,13 +307,13 @@ describe('Line controller tests', function() {
tension: 0.1,
// Point
x: 172,
x: 182,
y: 156,
// Control points
controlPointPreviousX: 164.8815225337256,
controlPointPreviousX: 174.8815225337256,
controlPointPreviousY: 143.38408449046415,
controlPointNextX: 174.98152253372558,
controlPointNextX: 184.98152253372558,
controlPointNextY: 161.28408449046415,
});
@ -327,13 +327,13 @@ describe('Line controller tests', function() {
tension: 0.1,
// Point
x: 222,
x: 232,
y: 194,
// Control points
controlPointPreviousX: 217,
controlPointPreviousX: 227,
controlPointPreviousY: 190.2,
controlPointNextX: 222,
controlPointNextX: 232,
controlPointNextY: 194,
});
@ -383,13 +383,13 @@ describe('Line controller tests', function() {
tension: 0.2,
// Point
x: 71,
x: 81,
y: 62,
// Control points
controlPointPreviousX: 71,
controlPointPreviousX: 81,
controlPointPreviousY: 62,
controlPointNextX: 81,
controlPointNextX: 91,
controlPointNextY: 52.6,
});
@ -403,13 +403,13 @@ describe('Line controller tests', function() {
tension: 0.2,
// Point
x: 121,
x: 131,
y: 15,
// Control points
controlPointPreviousX: 114.65778768378175,
controlPointPreviousX: 124.65778768378175,
controlPointPreviousY: 9.097346953222619,
controlPointNextX: 134.85778768378177,
controlPointNextX: 144.85778768378177,
controlPointNextY: 27.897346953222623,
});
@ -423,13 +423,13 @@ describe('Line controller tests', function() {
tension: 0.2,
// Point
x: 172,
x: 182,
y: 156,
// Control points
controlPointPreviousX: 157.76304506745115,
controlPointPreviousX: 167.76304506745115,
controlPointPreviousY: 130.76816898092827,
controlPointNextX: 177.96304506745116,
controlPointNextX: 187.96304506745116,
controlPointNextY: 166.56816898092828,
});
@ -443,13 +443,13 @@ describe('Line controller tests', function() {
tension: 0.2,
// Point
x: 222,
x: 232,
y: 194,
// Control points
controlPointPreviousX: 212,
controlPointPreviousX: 222,
controlPointPreviousY: 186.4,
controlPointNextX: 222,
controlPointNextX: 232,
controlPointNextY: 194,
});
@ -505,13 +505,13 @@ describe('Line controller tests', function() {
tension: 0.15,
// Point
x: 71,
x: 81,
y: 62,
// Control points
controlPointPreviousX: 71,
controlPointPreviousX: 81,
controlPointPreviousY: 62,
controlPointNextX: 78.5,
controlPointNextX: 88.5,
controlPointNextY: 54.95,
});
});

46
test/core.scaleService.tests.js
View File

@ -42,24 +42,24 @@ describe('Test the scale service', function() {
Chart.scaleService.update(chartInstance, canvasWidth, canvasHeight);
expect(chartInstance.chartArea).toEqual({
left: 45,
left: 55,
right: 245,
top: 5,
bottom: 76.0423977855504,
bottom: 75.0664716027288,
});
// Is xScale at the right spot
expect(xScale.left).toBe(45);
expect(xScale.left).toBe(55);
expect(xScale.right).toBe(245);
expect(xScale.top).toBe(76.0423977855504);
expect(xScale.top).toBe(75.0664716027288);
expect(xScale.bottom).toBe(145);
expect(xScale.labelRotation).toBe(55);
expect(xScale.labelRotation).toBe(57);
// Is yScale at the right spot
expect(yScale.left).toBe(5);
expect(yScale.right).toBe(45);
expect(yScale.right).toBe(55);
expect(yScale.top).toBe(5);
expect(yScale.bottom).toBe(76.0423977855504);
expect(yScale.bottom).toBe(75.0664716027288);
});
it('should fit scales that are in the top and right positions', function() {
@ -107,22 +107,22 @@ describe('Test the scale service', function() {
expect(chartInstance.chartArea).toEqual({
left: 5,
right: 205,
top: 73.9576022144496,
right: 195,
top: 74.9335283972712,
bottom: 145,
});
// Is xScale at the right spot
expect(xScale.left).toBe(5);
expect(xScale.right).toBe(205);
expect(xScale.right).toBe(195);
expect(xScale.top).toBe(5);
expect(xScale.bottom).toBe(73.9576022144496);
expect(xScale.labelRotation).toBe(55);
expect(xScale.bottom).toBe(74.9335283972712);
expect(xScale.labelRotation).toBe(57);
// Is yScale at the right spot
expect(yScale.left).toBe(205);
expect(yScale.left).toBe(195);
expect(yScale.right).toBe(245);
expect(yScale.top).toBe(73.9576022144496);
expect(yScale.top).toBe(74.9335283972712);
expect(yScale.bottom).toBe(145);
});
@ -179,28 +179,28 @@ describe('Test the scale service', function() {
Chart.scaleService.update(chartInstance, canvasWidth, canvasHeight);
expect(chartInstance.chartArea).toEqual({
left: 95,
left: 115,
right: 245,
top: 5,
bottom: 70.01536896070459,
bottom: 68.48521368620018,
});
// Is xScale at the right spot
expect(xScale.left).toBe(95);
expect(xScale.left).toBe(115);
expect(xScale.right).toBe(245);
expect(xScale.top).toBe(70.01536896070459);
expect(xScale.top).toBe(68.48521368620018);
expect(xScale.bottom).toBe(145);
// Are yScales at the right spot
expect(yScale1.left).toBe(5);
expect(yScale1.right).toBe(45);
expect(yScale1.right).toBe(55);
expect(yScale1.top).toBe(5);
expect(yScale1.bottom).toBe(70.01536896070459);
expect(yScale1.bottom).toBe(68.48521368620018);
expect(yScale2.left).toBe(45);
expect(yScale2.right).toBe(95);
expect(yScale2.left).toBe(55);
expect(yScale2.right).toBe(115);
expect(yScale2.top).toBe(5);
expect(yScale2.bottom).toBe(70.01536896070459);
expect(yScale2.bottom).toBe(68.48521368620018);
});
// This is an oddball case. What happens is, when the scales are fit the first time they must fit within the assigned size. In this case,

6
test/scale.linear.tests.js
View File

@ -592,10 +592,10 @@ describe('Linear Scale', function() {
var minSize = verticalScale.update(100, 300);
expect(minSize).toEqual({
width: 30,
width: 40,
height: 300,
});
expect(verticalScale.width).toBe(30);
expect(verticalScale.width).toBe(40);
expect(verticalScale.height).toBe(300);
expect(verticalScale.paddingTop).toBe(6);
expect(verticalScale.paddingBottom).toBe(6);
@ -622,7 +622,7 @@ describe('Linear Scale', function() {
config.scaleLabel.show = true;
minSize = verticalScale.update(100, 300);
expect(minSize).toEqual({
width: 48,
width: 58,
height: 300,
});
});