describe('Linear Scale', function() {
- it('Should register the constructor with the scale service', function() {
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- expect(Constructor).not.toBe(undefined);
- expect(typeof Constructor).toBe('function');
+ it('Should register the constructor with the scale service', function() {
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ expect(Constructor).not.toBe(undefined);
+ expect(typeof Constructor).toBe('function');
+ });
+
+ it('Should have the correct default config', function() {
+ var defaultConfig = Chart.scaleService.getScaleDefaults('linear');
+ expect(defaultConfig).toEqual({
+ display: true,
+
+ gridLines: {
+ color: "rgba(0, 0, 0, 0.1)",
+ drawOnChartArea: true,
+ drawTicks: true, // draw ticks extending towards the label
+ lineWidth: 1,
+ offsetGridLines: false,
+ show: true,
+ zeroLineColor: "rgba(0,0,0,0.25)",
+ zeroLineWidth: 1,
+ },
+ position: "left",
+ scaleLabel: {
+ fontColor: '#666',
+ fontFamily: 'Helvetica Neue',
+ fontSize: 12,
+ fontStyle: 'normal',
+ labelString: '',
+ show: false,
+ },
+ ticks: {
+ beginAtZero: false,
+ fontColor: "#666",
+ fontFamily: "Helvetica Neue",
+ fontSize: 12,
+ fontStyle: "normal",
+ maxRotation: 90,
+ minRotation: 20,
+ mirror: false,
+ padding: 10,
+ reverse: false,
+ show: true,
+ template: "<%=value%>"
+ }
});
+ });
- it('Should have the correct default config', function() {
- var defaultConfig = Chart.scaleService.getScaleDefaults('linear');
- expect(defaultConfig).toEqual({
- display: true,
-
- gridLines: {
- color: "rgba(0, 0, 0, 0.1)",
- drawOnChartArea: true,
- drawTicks: true, // draw ticks extending towards the label
- lineWidth: 1,
- offsetGridLines: false,
- show: true,
- zeroLineColor: "rgba(0,0,0,0.25)",
- zeroLineWidth: 1,
- },
- position: "left",
- scaleLabel: {
- fontColor: '#666',
- fontFamily: 'Helvetica Neue',
- fontSize: 12,
- fontStyle: 'normal',
- labelString: '',
- show: false,
- },
- ticks: {
- fontColor: "#666",
- fontFamily: "Helvetica Neue",
- fontSize: 12,
- fontStyle: "normal",
- maxRotation: 90,
- minRotation: 20,
- show: true,
- template: "<%=value%>"
- }
- });
+ it('Should correctly determine the max & min data values', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ yAxisID: scaleID,
+ data: [10, 5, 0, -5, 78, -100]
+ }, {
+ yAxisID: 'second scale',
+ data: [-1000, 1000],
+ }, {
+ yAxisID: scaleID,
+ data: [150]
+ }]
+ };
+
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: {},
+ options: Chart.scaleService.getScaleDefaults('linear'), // use default config for scale
+ data: mockData,
+ id: scaleID
});
- it('Should correctly determine the max & min data values', function() {
- var scaleID = 'myScale';
+ expect(scale).not.toEqual(undefined); // must construct
+ expect(scale.min).toBe(undefined); // not yet set
+ expect(scale.max).toBe(undefined);
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [10, 5, 0, -5, 78, -100]
- }, {
- yAxisID: 'second scale',
- data: [-1000, 1000],
- }, {
- yAxisID: scaleID,
- data: [150]
- }]
- };
-
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: {},
- options: Chart.scaleService.getScaleDefaults('linear'), // use default config for scale
- data: mockData,
- id: scaleID
- });
-
- expect(scale).not.toEqual(undefined); // must construct
- expect(scale.min).toBe(undefined); // not yet set
- expect(scale.max).toBe(undefined);
-
- // Set arbitrary width and height for now
- scale.width = 50;
- scale.height = 400;
-
- scale.buildTicks();
- expect(scale.min).toBe(-100);
- expect(scale.max).toBe(150);
- });
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
- it('Should correctly determine the max & min for scatter data', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [{
- x: 10,
- y: 100
- }, {
- x: -10,
- y: 0
- }, {
- x: 0,
- y: 0
- }, {
- x: 99,
- y: 7
- }]
- }]
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var verticalScale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
-
- // Set arbitrary width and height for now
- verticalScale.width = 50;
- verticalScale.height = 400;
-
- verticalScale.buildTicks();
- expect(verticalScale.min).toBe(0);
- expect(verticalScale.max).toBe(100);
-
- var horizontalConfig = Chart.helpers.clone(config);
- horizontalConfig.position = 'bottom';
- var horizontalScale = new Constructor({
- ctx: {},
- options: horizontalConfig,
- data: mockData,
- id: scaleID,
- });
-
- // Set arbitrary width and height for now
- horizontalScale.width = 400;
- horizontalScale.height = 50;
-
- horizontalScale.buildTicks();
- expect(horizontalScale.min).toBe(-20);
- expect(horizontalScale.max).toBe(100);
- });
+ scale.buildTicks();
+ expect(scale.min).toBe(-100);
+ expect(scale.max).toBe(150);
+ });
- it('Should correctly determine the min and max data values when stacked mode is turned on', function() {
- var scaleID = 'myScale';
+ it('Should correctly determine the max & min for scatter data', function() {
+ var scaleID = 'myScale';
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [10, 5, 0, -5, 78, -100]
+ var mockData = {
+ datasets: [{
+ xAxisID: scaleID, // for the horizontal scale
+ yAxisID: scaleID,
+ data: [{
+ x: 10,
+ y: 100
}, {
- yAxisID: 'second scale',
- data: [-1000, 1000],
+ x: -10,
+ y: 0
}, {
- yAxisID: scaleID,
- data: [150, 0, 0, -100, -10, 9]
+ x: 0,
+ y: 0
+ }, {
+ x: 99,
+ y: 7
}]
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- config.stacked = true; // enable scale stacked mode
-
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
-
- // Set arbitrary width and height for now
- scale.width = 50;
- scale.height = 400;
-
- scale.buildTicks();
- expect(scale.min).toBe(-150);
- expect(scale.max).toBe(200);
+ }]
+ };
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var verticalScale = new Constructor({
+ ctx: {},
+ options: config,
+ data: mockData,
+ id: scaleID
});
- it('Should ensure that the scale has a max and min that are not equal', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: []
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
-
- // Set arbitrary width and height for now
- scale.width = 50;
- scale.height = 400;
-
- scale.buildTicks();
- expect(scale.min).toBe(-1);
- expect(scale.max).toBe(1);
+ // Set arbitrary width and height for now
+ verticalScale.width = 50;
+ verticalScale.height = 400;
+
+ verticalScale.buildTicks();
+ expect(verticalScale.min).toBe(0);
+ expect(verticalScale.max).toBe(100);
+
+ var horizontalConfig = Chart.helpers.clone(config);
+ horizontalConfig.position = 'bottom';
+ var horizontalScale = new Constructor({
+ ctx: {},
+ options: horizontalConfig,
+ data: mockData,
+ id: scaleID,
});
- it('should forcibly include 0 in the range if the beginAtZero option is used', function() {
- var scaleID = 'myScale';
+ // Set arbitrary width and height for now
+ horizontalScale.width = 400;
+ horizontalScale.height = 50;
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [20, 30, 40, 50]
- }]
- };
+ horizontalScale.buildTicks();
+ expect(horizontalScale.min).toBe(-20);
+ expect(horizontalScale.max).toBe(100);
+ });
+
+ it('Should correctly determine the min and max data values when stacked mode is turned on', function() {
+ var scaleID = 'myScale';
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var mockData = {
+ datasets: [{
+ yAxisID: scaleID,
+ data: [10, 5, 0, -5, 78, -100]
+ }, {
+ yAxisID: 'second scale',
+ data: [-1000, 1000],
+ }, {
+ yAxisID: scaleID,
+ data: [150, 0, 0, -100, -10, 9]
+ }]
+ };
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ config.stacked = true; // enable scale stacked mode
+
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: {},
+ options: config,
+ data: mockData,
+ id: scaleID
+ });
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
+
+ scale.buildTicks();
+ expect(scale.min).toBe(-150);
+ expect(scale.max).toBe(200);
+ });
+
+ it('Should ensure that the scale has a max and min that are not equal', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: []
+ };
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: {},
+ options: config,
+ data: mockData,
+ id: scaleID
+ });
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
- // Set arbitrary width and height for now
- scale.width = 50;
- scale.height = 400;
+ scale.buildTicks();
+ expect(scale.min).toBe(-1);
+ expect(scale.max).toBe(1);
+ });
- scale.buildTicks();
- expect(scale.ticks).toEqual([50, 45, 40, 35, 30, 25, 20]);
+ it('should forcibly include 0 in the range if the beginAtZero option is used', function() {
+ var scaleID = 'myScale';
- config.beginAtZero = true;
- scale.buildTicks();
- expect(scale.ticks).toEqual([50, 45, 40, 35, 30, 25, 20, 15, 10, 5, 0]);
+ var mockData = {
+ datasets: [{
+ yAxisID: scaleID,
+ data: [20, 30, 40, 50]
+ }]
+ };
- mockData.datasets[0].data = [-20, -30, -40, -50];
- scale.buildTicks();
- expect(scale.ticks).toEqual([0, -5, -10, -15, -20, -25, -30, -35, -40, -45, -50]);
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- config.beginAtZero = false;
- scale.buildTicks();
- expect(scale.ticks).toEqual([-20, -25, -30, -35, -40, -45, -50]);
- });
- it('Should generate tick marks', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [10, 5, 0, 25, 78]
- }, ]
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
-
- // Set arbitrary width and height for now
- scale.width = 50;
- scale.height = 400;
-
- scale.buildTicks();
-
- // Counts down because the lines are drawn top to bottom
- expect(scale.ticks).toEqual([80, 70, 60, 50, 40, 30, 20, 10, 0]);
- expect(scale.start).toBe(0);
- expect(scale.end).toBe(80);
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: {},
+ options: config,
+ data: mockData,
+ id: scaleID
});
- it('Should generate tick marks in the correct order in reversed mode', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [10, 5, 0, 25, 78]
- }, ]
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- config.reverse = true;
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
-
- // Set arbitrary width and height for now
- scale.width = 50;
- scale.height = 400;
-
- scale.buildTicks();
-
- // Reverse mode makes this count up
- expect(scale.ticks).toEqual([0, 10, 20, 30, 40, 50, 60, 70, 80]);
- expect(scale.start).toBe(80);
- expect(scale.end).toBe(0);
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
+
+ scale.buildTicks();
+ expect(scale.ticks).toEqual([50, 45, 40, 35, 30, 25, 20]);
+
+ config.ticks.beginAtZero = true;
+ scale.buildTicks();
+ expect(scale.ticks).toEqual([50, 45, 40, 35, 30, 25, 20, 15, 10, 5, 0]);
+
+ mockData.datasets[0].data = [-20, -30, -40, -50];
+ scale.buildTicks();
+ expect(scale.ticks).toEqual([0, -5, -10, -15, -20, -25, -30, -35, -40, -45, -50]);
+
+ config.ticks.beginAtZero = false;
+ scale.buildTicks();
+ expect(scale.ticks).toEqual([-20, -25, -30, -35, -40, -45, -50]);
+ });
+
+ it('Should generate tick marks', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ yAxisID: scaleID,
+ data: [10, 5, 0, 25, 78]
+ }, ]
+ };
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: {},
+ options: config,
+ data: mockData,
+ id: scaleID
});
- it('Should build labels using the default template', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [10, 5, 0, 25, 78]
- }, ]
- };
-
- var mockContext = window.createMockContext();
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- // Set arbitrary width and height for now
- scale.update(50, 400);
- expect(scale.ticks).toEqual(['80', '70', '60', '50', '40', '30', '20', '10', '0']);
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
+
+ scale.buildTicks();
+
+ // Counts down because the lines are drawn top to bottom
+ expect(scale.ticks).toEqual([80, 70, 60, 50, 40, 30, 20, 10, 0]);
+ expect(scale.start).toBe(0);
+ expect(scale.end).toBe(80);
+ });
+
+ it('Should generate tick marks in the correct order in reversed mode', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ yAxisID: scaleID,
+ data: [10, 5, 0, 25, 78]
+ }, ]
+ };
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ config.ticks.reverse = true;
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: {},
+ options: config,
+ data: mockData,
+ id: scaleID
});
- it('Should build labels using the user supplied callback', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [10, 5, 0, 25, 78]
- }, ]
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- config.ticks.userCallback = function(value, index) {
- return index.toString();
- };
-
- var mockContext = window.createMockContext();
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var scale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- scale.update(400, 400);
-
- // Just the index
- expect(scale.ticks).toEqual(['0', '1', '2', '3', '4', '5', '6', '7', '8']);
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
+
+ scale.buildTicks();
+
+ // Reverse mode makes this count up
+ expect(scale.ticks).toEqual([0, 10, 20, 30, 40, 50, 60, 70, 80]);
+ expect(scale.start).toBe(80);
+ expect(scale.end).toBe(0);
+ });
+
+ it('Should build labels using the default template', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ yAxisID: scaleID,
+ data: [10, 5, 0, 25, 78]
+ }, ]
+ };
+
+ var mockContext = window.createMockContext();
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: mockContext,
+ options: config,
+ data: mockData,
+ id: scaleID
});
- it('Should get the correct pixel value for a point', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: []
- }]
- };
-
- var mockContext = window.createMockContext();
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var verticalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- // Update
- verticalScale.update(50, 100);
-
- // Fake out positioning of the scale service
- verticalScale.left = 0;
- verticalScale.top = 0;
- verticalScale.right = 50;
- verticalScale.bottom = 110;
- verticalScale.paddingTop = 5;
- verticalScale.paddingBottom = 5;
- verticalScale.width = 50;
- verticalScale.height = 110;
-
- expect(verticalScale.getPixelForValue(1, 0, 0)).toBe(5); // top + paddingTop
- expect(verticalScale.getPixelForValue(-1, 0, 0)).toBe(105); // bottom - paddingBottom
- expect(verticalScale.getPixelForValue(0, 0, 0)).toBe(55); // halfway
-
- var horizontalConfig = Chart.helpers.clone(config);
- horizontalConfig.position = 'bottom';
- var horizontalScale = new Constructor({
- ctx: mockContext,
- options: horizontalConfig,
- data: mockData,
- id: scaleID,
- });
-
- horizontalScale.update(100, 50);
-
- // Fake out positioning of the scale service
- horizontalScale.left = 0;
- horizontalScale.top = 0;
- horizontalScale.right = 110;
- horizontalScale.bottom = 50;
- horizontalScale.paddingLeft = 5;
- horizontalScale.paddingRight = 5;
- horizontalScale.width = 110;
- horizontalScale.height = 50;
-
- // Range expands to [-2, 2] due to nicenum algorithm
- expect(horizontalScale.getPixelForValue(2, 0, 0)).toBe(105); // right - paddingRight
- expect(horizontalScale.getPixelForValue(-2, 0, 0)).toBe(5); // left + paddingLeft
- expect(horizontalScale.getPixelForValue(0, 0, 0)).toBe(55); // halfway
+ // Set arbitrary width and height for now
+ scale.update(50, 400);
+ expect(scale.ticks).toEqual(['80', '70', '60', '50', '40', '30', '20', '10', '0']);
+ });
+
+ it('Should build labels using the user supplied callback', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ yAxisID: scaleID,
+ data: [10, 5, 0, 25, 78]
+ }, ]
+ };
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ config.ticks.userCallback = function(value, index) {
+ return index.toString();
+ };
+
+ var mockContext = window.createMockContext();
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var scale = new Constructor({
+ ctx: mockContext,
+ options: config,
+ data: mockData,
+ id: scaleID
});
- it('should fit correctly', function() {
- var scaleID = 'myScale';
+ scale.update(400, 400);
+
+ // Just the index
+ expect(scale.ticks).toEqual(['0', '1', '2', '3', '4', '5', '6', '7', '8']);
+ });
+
+ it('Should get the correct pixel value for a point', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ xAxisID: scaleID, // for the horizontal scale
+ yAxisID: scaleID,
+ data: []
+ }]
+ };
+
+ var mockContext = window.createMockContext();
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var verticalScale = new Constructor({
+ ctx: mockContext,
+ options: config,
+ data: mockData,
+ id: scaleID
+ });
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [-5, 0, 2, -3, 5]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var verticalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = verticalScale.update(100, 300);
- expect(minSize).toEqual({
- width: 33,
- height: 300,
- });
- expect(verticalScale.width).toBe(33);
- expect(verticalScale.height).toBe(300);
- expect(verticalScale.paddingTop).toBe(6);
- expect(verticalScale.paddingBottom).toBe(6);
- expect(verticalScale.paddingLeft).toBe(0);
- expect(verticalScale.paddingRight).toBe(0);
-
- // Refit with margins to see the padding go away
- minSize = verticalScale.update(33, 300, {
- left: 0,
- right: 0,
- top: 15,
- bottom: 3
- });
- expect(minSize).toEqual({
- width: 33,
- height: 300,
- });
- expect(verticalScale.paddingTop).toBe(0);
- expect(verticalScale.paddingBottom).toBe(3);
- expect(verticalScale.paddingLeft).toBe(0);
- expect(verticalScale.paddingRight).toBe(0);
-
- // Extra size when scale label showing
- config.scaleLabel.show = true;
- minSize = verticalScale.update(100, 300);
- expect(minSize).toEqual({
- width: 51,
- height: 300,
- });
+ // Update
+ verticalScale.update(50, 100);
+
+ // Fake out positioning of the scale service
+ verticalScale.left = 0;
+ verticalScale.top = 0;
+ verticalScale.right = 50;
+ verticalScale.bottom = 110;
+ verticalScale.paddingTop = 5;
+ verticalScale.paddingBottom = 5;
+ verticalScale.width = 50;
+ verticalScale.height = 110;
+
+ expect(verticalScale.getPixelForValue(1, 0, 0)).toBe(5); // top + paddingTop
+ expect(verticalScale.getPixelForValue(-1, 0, 0)).toBe(105); // bottom - paddingBottom
+ expect(verticalScale.getPixelForValue(0, 0, 0)).toBe(55); // halfway
+
+ var horizontalConfig = Chart.helpers.clone(config);
+ horizontalConfig.position = 'bottom';
+ var horizontalScale = new Constructor({
+ ctx: mockContext,
+ options: horizontalConfig,
+ data: mockData,
+ id: scaleID,
});
- it('should fit correctly when horizontal', function() {
- var scaleID = 'myScale';
+ horizontalScale.update(100, 50);
+
+ // Fake out positioning of the scale service
+ horizontalScale.left = 0;
+ horizontalScale.top = 0;
+ horizontalScale.right = 110;
+ horizontalScale.bottom = 50;
+ horizontalScale.paddingLeft = 5;
+ horizontalScale.paddingRight = 5;
+ horizontalScale.width = 110;
+ horizontalScale.height = 50;
+
+ // Range expands to [-2, 2] due to nicenum algorithm
+ expect(horizontalScale.getPixelForValue(2, 0, 0)).toBe(105); // right - paddingRight
+ expect(horizontalScale.getPixelForValue(-2, 0, 0)).toBe(5); // left + paddingLeft
+ expect(horizontalScale.getPixelForValue(0, 0, 0)).toBe(55); // halfway
+ });
+
+ it('should fit correctly', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ xAxisID: scaleID, // for the horizontal scale
+ yAxisID: scaleID,
+ data: [-5, 0, 2, -3, 5]
+ }]
+ };
+ var mockContext = window.createMockContext();
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var verticalScale = new Constructor({
+ ctx: mockContext,
+ options: config,
+ data: mockData,
+ id: scaleID
+ });
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [-5, 0, 2, -3, 5]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- config.position = "bottom";
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var verticalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = verticalScale.update(100, 300);
- expect(minSize).toEqual({
- width: 100,
- height: 28,
- });
- expect(verticalScale.width).toBe(100);
- expect(verticalScale.height).toBe(28);
- expect(verticalScale.paddingTop).toBe(0);
- expect(verticalScale.paddingBottom).toBe(0);
- expect(verticalScale.paddingLeft).toBe(15);
- expect(verticalScale.paddingRight).toBe(10);
-
- // Refit with margins to see the padding go away
- minSize = verticalScale.update(100, 28, {
- left: 10,
- right: 6,
- top: 15,
- bottom: 3
- });
- expect(minSize).toEqual({
- width: 100,
- height: 28,
- });
- expect(verticalScale.paddingTop).toBe(0);
- expect(verticalScale.paddingBottom).toBe(0);
- expect(verticalScale.paddingLeft).toBe(5);
- expect(verticalScale.paddingRight).toBe(4);
-
- // Extra size when scale label showing
- config.scaleLabel.show = true;
- minSize = verticalScale.update(100, 300);
- expect(minSize).toEqual({
- width: 100,
- height: 46,
- });
+ var minSize = verticalScale.update(100, 300);
+ expect(minSize).toEqual({
+ width: 30,
+ height: 300,
+ });
+ expect(verticalScale.width).toBe(30);
+ expect(verticalScale.height).toBe(300);
+ expect(verticalScale.paddingTop).toBe(6);
+ expect(verticalScale.paddingBottom).toBe(6);
+ expect(verticalScale.paddingLeft).toBe(0);
+ expect(verticalScale.paddingRight).toBe(0);
+
+ // Refit with margins to see the padding go away
+ minSize = verticalScale.update(30, 300, {
+ left: 0,
+ right: 0,
+ top: 15,
+ bottom: 3
+ });
+ expect(minSize).toEqual({
+ width: 30,
+ height: 300,
+ });
+ expect(verticalScale.paddingTop).toBe(0);
+ expect(verticalScale.paddingBottom).toBe(3);
+ expect(verticalScale.paddingLeft).toBe(0);
+ expect(verticalScale.paddingRight).toBe(0);
+
+ // Extra size when scale label showing
+ config.scaleLabel.show = true;
+ minSize = verticalScale.update(100, 300);
+ expect(minSize).toEqual({
+ width: 48,
+ height: 300,
+ });
+ });
+
+ it('should fit correctly when horizontal', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ xAxisID: scaleID, // for the horizontal scale
+ yAxisID: scaleID,
+ data: [-5, 0, 2, -3, 5]
+ }]
+ };
+ var mockContext = window.createMockContext();
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ config.position = "bottom";
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var verticalScale = new Constructor({
+ ctx: mockContext,
+ options: config,
+ data: mockData,
+ id: scaleID
});
- it('should draw correctly horizontally', function() {
- var scaleID = 'myScale';
+ var minSize = verticalScale.update(100, 300);
+ expect(minSize).toEqual({
+ width: 100,
+ height: 28,
+ });
+ expect(verticalScale.width).toBe(100);
+ expect(verticalScale.height).toBe(28);
+ expect(verticalScale.paddingTop).toBe(0);
+ expect(verticalScale.paddingBottom).toBe(0);
+ expect(verticalScale.paddingLeft).toBe(18);
+ expect(verticalScale.paddingRight).toBe(13);
+
+ // Refit with margins to see the padding go away
+ minSize = verticalScale.update(100, 28, {
+ left: 10,
+ right: 6,
+ top: 15,
+ bottom: 3
+ });
+ expect(minSize).toEqual({
+ width: 100,
+ height: 28,
+ });
+ expect(verticalScale.paddingTop).toBe(0);
+ expect(verticalScale.paddingBottom).toBe(0);
+ expect(verticalScale.paddingLeft).toBe(8);
+ expect(verticalScale.paddingRight).toBe(7);
+
+ // Extra size when scale label showing
+ config.scaleLabel.show = true;
+ minSize = verticalScale.update(100, 300);
+ expect(minSize).toEqual({
+ width: 100,
+ height: 46,
+ });
+ });
+
+ it('should draw correctly horizontally', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ xAxisID: scaleID, // for the horizontal scale
+ yAxisID: scaleID,
+ data: [-5, 0, 2, -3, 5]
+ }]
+ };
+ var mockContext = window.createMockContext();
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ config.position = "bottom";
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var horizontalScale = new Constructor({
+ ctx: mockContext,
+ options: config,
+ data: mockData,
+ id: scaleID
+ });
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [-5, 0, 2, -3, 5]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- config.position = "bottom";
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var horizontalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = horizontalScale.fit(100, 300);
- minSize = horizontalScale.fit(100, 28, {
- left: 10,
- right: 6,
- top: 15,
- bottom: 3
- });
-
- horizontalScale.left = 0;
- horizontalScale.right = minSize.width;
- horizontalScale.top = 0;
- horizontalScale.bottom = minSize.height;
-
- var chartArea = {
- top: 100,
- bottom: 0,
- left: 0,
- right: minSize.width
- };
- horizontalScale.draw(chartArea);
-
- expect(mockContext.getCalls()).toEqual([{
- "name": "measureText",
- "args": ["-10"]
- }, {
- "name": "measureText",
- "args": ["10"]
- }, {
- "name": "measureText",
- "args": ["-10"]
- }, {
- "name": "measureText",
- "args": ["10"]
- }, {
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [5.5, 0]
- }, {
- "name": "lineTo",
- "args": [5.5, 5]
- }, {
- "name": "moveTo",
- "args": [5.5, 100]
- }, {
- "name": "lineTo",
- "args": [5.5, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [51, 0]
- }, {
- "name": "lineTo",
- "args": [51, 5]
- }, {
- "name": "moveTo",
- "args": [51, 100]
- }, {
- "name": "lineTo",
- "args": [51, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [96.5, 0]
- }, {
- "name": "lineTo",
- "args": [96.5, 5]
- }, {
- "name": "moveTo",
- "args": [96.5, 100]
- }, {
- "name": "lineTo",
- "args": [96.5, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "fillText",
- "args": ["-10", 5, 10]
- }, {
- "name": "fillText",
- "args": ["0", 50.5, 10]
- }, {
- "name": "fillText",
- "args": ["10", 96, 10]
- }]);
-
- // Turn off some drawing
- config.gridLines.drawTicks = false;
- config.gridLines.drawOnChartArea = false;
- config.labels.show = false;
- config.scaleLabel.show = true;
- config.scaleLabel.labelString = 'myLabel'
-
- mockContext.resetCalls();
-
- horizontalScale.draw();
- expect(mockContext.getCalls()).toEqual([{
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "fillText",
- "args": ["myLabel", 50, 22]
- }]);
+ var minSize = horizontalScale.update(100, 300);
+ minSize = horizontalScale.update(100, 28, {
+ left: 10,
+ right: 6,
+ top: 15,
+ bottom: 3
+ });
- // Turn off display
+ horizontalScale.left = 0;
+ horizontalScale.right = minSize.width;
+ horizontalScale.top = 0;
+ horizontalScale.bottom = minSize.height;
+
+ var chartArea = {
+ top: 100,
+ bottom: 0,
+ left: 0,
+ right: minSize.width
+ };
+ mockContext.resetCalls();
+ horizontalScale.draw(chartArea);
+
+ var expected = [{
+ "name": "setFillStyle",
+ "args": ["#666"]
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [8.5, 0]
+ }, {
+ "name": "lineTo",
+ "args": [8.5, 10]
+ }, {
+ "name": "moveTo",
+ "args": [8.5, 100]
+ }, {
+ "name": "lineTo",
+ "args": [8.5, 0]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [8, 8]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["-10", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0,0,0,0.25)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [51.5, 0]
+ }, {
+ "name": "lineTo",
+ "args": [51.5, 10]
+ }, {
+ "name": "moveTo",
+ "args": [51.5, 100]
+ }, {
+ "name": "lineTo",
+ "args": [51.5, 0]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [51, 8]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["0", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [93.5, 0]
+ }, {
+ "name": "lineTo",
+ "args": [93.5, 10]
+ }, {
+ "name": "moveTo",
+ "args": [93.5, 100]
+ }, {
+ "name": "lineTo",
+ "args": [93.5, 0]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [93, 8]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["10", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }];
+ expect(mockContext.getCalls()).toEqual(expected);
+
+ // Turn off some drawing
+ config.gridLines.drawTicks = false;
+ config.gridLines.drawOnChartArea = false;
+ config.ticks.show = false;
+ config.scaleLabel.show = true;
+ config.scaleLabel.labelString = 'myLabel'
+
+ mockContext.resetCalls();
+
+ horizontalScale.draw();
+ expect(mockContext.getCalls()).toEqual([{
+ "name": "setFillStyle",
+ "args": ["#666"]
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0,0,0,0.25)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "fillText",
+ "args": ["myLabel", 50, 22]
+ }]);
+
+ // Turn off display
+
+ mockContext.resetCalls();
+ config.display = false;
+ horizontalScale.draw();
+ expect(mockContext.getCalls()).toEqual([]);
+ });
+
+ it('should draw correctly vertically', function() {
+ var scaleID = 'myScale';
+
+ var mockData = {
+ datasets: [{
+ xAxisID: scaleID, // for the horizontal scale
+ yAxisID: scaleID,
+ data: [-5, 0, 2, -3, 5]
+ }]
+ };
+ var mockContext = window.createMockContext();
+
+ var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
+ var Constructor = Chart.scaleService.getScaleConstructor('linear');
+ var verticalScale = new Constructor({
+ ctx: mockContext,
+ options: config,
+ data: mockData,
+ id: scaleID
+ });
- mockContext.resetCalls();
- config.display = false;
- horizontalScale.draw();
- expect(mockContext.getCalls()).toEqual([]);
+ var minSize = verticalScale.update(100, 300);
+ minSize = verticalScale.update(30, 300, {
+ left: 0,
+ right: 0,
+ top: 15,
+ bottom: 3
+ });
+ expect(minSize).toEqual({
+ width: 30,
+ height: 300,
});
- it('should draw correctly vertically', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [-5, 0, 2, -3, 5]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear'));
- var Constructor = Chart.scaleService.getScaleConstructor('linear');
- var verticalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = verticalScale.fit(100, 300);
- minSize = verticalScale.fit(33, 300, {
- left: 0,
- right: 0,
- top: 15,
- bottom: 3
- });
- expect(minSize).toEqual({
- width: 33,
- height: 300,
- });
-
- verticalScale.left = 0;
- verticalScale.right = minSize.width;
- verticalScale.top = 0;
- verticalScale.bottom = minSize.height;
-
- var chartArea = {
- top: 0,
- bottom: minSize.height,
- left: minSize.width,
- right: minSize.width + 100
- };
- verticalScale.draw(chartArea);
-
- expect(mockContext.getCalls()).toEqual([{
- "name": "measureText",
- "args": ["5"]
- }, {
- "name": "measureText",
- "args": ["4"]
- }, {
- "name": "measureText",
- "args": ["3"]
- }, {
- "name": "measureText",
- "args": ["2"]
- }, {
- "name": "measureText",
- "args": ["1"]
- }, {
- "name": "measureText",
- "args": ["0"]
- }, {
- "name": "measureText",
- "args": ["-1"]
- }, {
- "name": "measureText",
- "args": ["-2"]
- }, {
- "name": "measureText",
- "args": ["-3"]
- }, {
- "name": "measureText",
- "args": ["-4"]
- }, {
- "name": "measureText",
- "args": ["-5"]
- }, {
- "name": "measureText",
- "args": ["5"]
- }, {
- "name": "measureText",
- "args": ["4"]
- }, {
- "name": "measureText",
- "args": ["3"]
- }, {
- "name": "measureText",
- "args": ["2"]
- }, {
- "name": "measureText",
- "args": ["1"]
- }, {
- "name": "measureText",
- "args": ["0"]
- }, {
- "name": "measureText",
- "args": ["-1"]
- }, {
- "name": "measureText",
- "args": ["-2"]
- }, {
- "name": "measureText",
- "args": ["-3"]
- }, {
- "name": "measureText",
- "args": ["-4"]
- }, {
- "name": "measureText",
- "args": ["-5"]
- }, {
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 0.5]
- }, {
- "name": "lineTo",
- "args": [33, 0.5]
- }, {
- "name": "moveTo",
- "args": [33, 0.5]
- }, {
- "name": "lineTo",
- "args": [133, 0.5]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 30.19999999999999]
- }, {
- "name": "lineTo",
- "args": [33, 30.19999999999999]
- }, {
- "name": "moveTo",
- "args": [33, 30.19999999999999]
- }, {
- "name": "lineTo",
- "args": [133, 30.19999999999999]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 59.900000000000006]
- }, {
- "name": "lineTo",
- "args": [33, 59.900000000000006]
- }, {
- "name": "moveTo",
- "args": [33, 59.900000000000006]
- }, {
- "name": "lineTo",
- "args": [133, 59.900000000000006]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 89.6]
- }, {
- "name": "lineTo",
- "args": [33, 89.6]
- }, {
- "name": "moveTo",
- "args": [33, 89.6]
- }, {
- "name": "lineTo",
- "args": [133, 89.6]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 119.30000000000001]
- }, {
- "name": "lineTo",
- "args": [33, 119.30000000000001]
- }, {
- "name": "moveTo",
- "args": [33, 119.30000000000001]
- }, {
- "name": "lineTo",
- "args": [133, 119.30000000000001]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 149]
- }, {
- "name": "lineTo",
- "args": [33, 149]
- }, {
- "name": "moveTo",
- "args": [33, 149]
- }, {
- "name": "lineTo",
- "args": [133, 149]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 178.7]
- }, {
- "name": "lineTo",
- "args": [33, 178.7]
- }, {
- "name": "moveTo",
- "args": [33, 178.7]
- }, {
- "name": "lineTo",
- "args": [133, 178.7]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 208.4]
- }, {
- "name": "lineTo",
- "args": [33, 208.4]
- }, {
- "name": "moveTo",
- "args": [33, 208.4]
- }, {
- "name": "lineTo",
- "args": [133, 208.4]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 238.1]
- }, {
- "name": "lineTo",
- "args": [33, 238.1]
- }, {
- "name": "moveTo",
- "args": [33, 238.1]
- }, {
- "name": "lineTo",
- "args": [133, 238.1]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 267.8]
- }, {
- "name": "lineTo",
- "args": [33, 267.8]
- }, {
- "name": "moveTo",
- "args": [33, 267.8]
- }, {
- "name": "lineTo",
- "args": [133, 267.8]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 297.5]
- }, {
- "name": "lineTo",
- "args": [33, 297.5]
- }, {
- "name": "moveTo",
- "args": [33, 297.5]
- }, {
- "name": "lineTo",
- "args": [133, 297.5]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "fillText",
- "args": ["5", 23, 0]
- }, {
- "name": "fillText",
- "args": ["4", 23, 29.69999999999999]
- }, {
- "name": "fillText",
- "args": ["3", 23, 59.400000000000006]
- }, {
- "name": "fillText",
- "args": ["2", 23, 89.1]
- }, {
- "name": "fillText",
- "args": ["1", 23, 118.80000000000001]
- }, {
- "name": "fillText",
- "args": ["0", 23, 148.5]
- }, {
- "name": "fillText",
- "args": ["-1", 23, 178.2]
- }, {
- "name": "fillText",
- "args": ["-2", 23, 207.9]
- }, {
- "name": "fillText",
- "args": ["-3", 23, 237.6]
- }, {
- "name": "fillText",
- "args": ["-4", 23, 267.3]
- }, {
- "name": "fillText",
- "args": ["-5", 23, 297]
- }]);
-
- // Turn off some drawing
- config.gridLines.drawTicks = false;
- config.gridLines.drawOnChartArea = false;
- config.labels.show = false;
- config.scaleLabel.show = true;
-
- mockContext.resetCalls();
-
- verticalScale.draw();
- expect(mockContext.getCalls()).toEqual([{
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "save",
- "args": []
- }, {
- "name": "translate",
- "args": [6, 150]
- }, {
- "name": "rotate",
- "args": [-1.5707963267948966]
- }, {
- "name": "fillText",
- "args": ["", 0, 0]
- }, {
- "name": "restore",
- "args": []
- }]);
- });
- });
\ No newline at end of file
+ verticalScale.left = 0;
+ verticalScale.right = minSize.width;
+ verticalScale.top = 0;
+ verticalScale.bottom = minSize.height;
+
+ var chartArea = {
+ top: 0,
+ bottom: minSize.height,
+ left: minSize.width,
+ right: minSize.width + 100
+ };
+
+ mockContext.resetCalls();
+ verticalScale.draw(chartArea);
+
+ expect(mockContext.getCalls()).toEqual([{
+ "name": "setFillStyle",
+ "args": ["#666"]
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 0.5]
+ }, {
+ "name": "lineTo",
+ "args": [30, 0.5]
+ }, {
+ "name": "moveTo",
+ "args": [30, 0.5]
+ }, {
+ "name": "lineTo",
+ "args": [130, 0.5]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 0]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["5", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 30.2]
+ }, {
+ "name": "lineTo",
+ "args": [30, 30.2]
+ }, {
+ "name": "moveTo",
+ "args": [30, 30.2]
+ }, {
+ "name": "lineTo",
+ "args": [130, 30.2]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 29.7]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["4", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 59.9]
+ }, {
+ "name": "lineTo",
+ "args": [30, 59.9]
+ }, {
+ "name": "moveTo",
+ "args": [30, 59.9]
+ }, {
+ "name": "lineTo",
+ "args": [130, 59.9]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 59.4]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["3", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 89.6]
+ }, {
+ "name": "lineTo",
+ "args": [30, 89.6]
+ }, {
+ "name": "moveTo",
+ "args": [30, 89.6]
+ }, {
+ "name": "lineTo",
+ "args": [130, 89.6]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 89.1]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["2", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 119.3]
+ }, {
+ "name": "lineTo",
+ "args": [30, 119.3]
+ }, {
+ "name": "moveTo",
+ "args": [30, 119.3]
+ }, {
+ "name": "lineTo",
+ "args": [130, 119.3]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 118.8]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["1", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0,0,0,0.25)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 149]
+ }, {
+ "name": "lineTo",
+ "args": [30, 149]
+ }, {
+ "name": "moveTo",
+ "args": [30, 149]
+ }, {
+ "name": "lineTo",
+ "args": [130, 149]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 148.5]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["0", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 178.7]
+ }, {
+ "name": "lineTo",
+ "args": [30, 178.7]
+ }, {
+ "name": "moveTo",
+ "args": [30, 178.7]
+ }, {
+ "name": "lineTo",
+ "args": [130, 178.7]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 178.2]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["-1", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 208.4]
+ }, {
+ "name": "lineTo",
+ "args": [30, 208.4]
+ }, {
+ "name": "moveTo",
+ "args": [30, 208.4]
+ }, {
+ "name": "lineTo",
+ "args": [130, 208.4]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 207.9]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["-2", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 238.1]
+ }, {
+ "name": "lineTo",
+ "args": [30, 238.1]
+ }, {
+ "name": "moveTo",
+ "args": [30, 238.1]
+ }, {
+ "name": "lineTo",
+ "args": [130, 238.1]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 237.6]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["-3", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 267.8]
+ }, {
+ "name": "lineTo",
+ "args": [30, 267.8]
+ }, {
+ "name": "moveTo",
+ "args": [30, 267.8]
+ }, {
+ "name": "lineTo",
+ "args": [130, 267.8]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 267.3]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["-4", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "moveTo",
+ "args": [25, 297.5]
+ }, {
+ "name": "lineTo",
+ "args": [30, 297.5]
+ }, {
+ "name": "moveTo",
+ "args": [30, 297.5]
+ }, {
+ "name": "lineTo",
+ "args": [130, 297.5]
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [20, 297]
+ }, {
+ "name": "rotate",
+ "args": [-0]
+ }, {
+ "name": "fillText",
+ "args": ["-5", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }]);
+
+ // Turn off some drawing
+ config.gridLines.drawTicks = false;
+ config.gridLines.drawOnChartArea = false;
+ config.ticks.show = false;
+ config.scaleLabel.show = true;
+
+ mockContext.resetCalls();
+
+ verticalScale.draw();
+ expect(mockContext.getCalls()).toEqual([{
+ "name": "setFillStyle",
+ "args": ["#666"]
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0,0,0,0.25)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "setLineWidth",
+ "args": [1]
+ }, {
+ "name": "setStrokeStyle",
+ "args": ["rgba(0, 0, 0, 0.1)"]
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "beginPath",
+ "args": []
+ }, {
+ "name": "stroke",
+ "args": []
+ }, {
+ "name": "save",
+ "args": []
+ }, {
+ "name": "translate",
+ "args": [6, 150]
+ }, {
+ "name": "rotate",
+ "args": [-1.5707963267948966]
+ }, {
+ "name": "fillText",
+ "args": ["", 0, 0]
+ }, {
+ "name": "restore",
+ "args": []
+ }]);
+ });
+});
\ No newline at end of file
var defaultConfig = Chart.scaleService.getScaleDefaults('logarithmic');
expect(defaultConfig).toEqual({
display: true,
- position: "left",
gridLines: {
- show: true,
color: "rgba(0, 0, 0, 0.1)",
- lineWidth: 1,
drawOnChartArea: true,
drawTicks: true,
- zeroLineWidth: 1,
+ lineWidth: 1,
+ offsetGridLines: false,
+ show: true,
zeroLineColor: "rgba(0,0,0,0.25)",
+ zeroLineWidth: 1,
},
+ position: "left",
scaleLabel: {
fontColor: '#666',
fontFamily: 'Helvetica Neue',
labelString: '',
show: false,
},
- reverse: false,
- override: null,
- labels: {
- show: true,
+ ticks: {
+ beginAtZero: false,
+ fontColor: "#666",
+ fontFamily: "Helvetica Neue",
+ fontSize: 12,
+ fontStyle: "normal",
+ maxRotation: 90,
+ minRotation: 20,
mirror: false,
padding: 10,
+ reverse: false,
+ show: true,
template: "<%var remain = value / (Math.pow(10, Math.floor(Chart.helpers.log10(value))));if (remain === 1 || remain === 2 || remain === 5) {%><%=value.toExponential()%><%} else {%><%= null %><%}%>",
- fontSize: 12,
- fontStyle: "normal",
- fontColor: "#666",
- fontFamily: "Helvetica Neue"
- }
+ },
});
});
}]
};
+ var mockContext = window.createMockContext();
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var scale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: Chart.scaleService.getScaleDefaults('logarithmic'), // use default config for scale
data: mockData,
id: scaleID
expect(scale.min).toBe(undefined); // not yet set
expect(scale.max).toBe(undefined);
- scale.calculateRange();
- expect(scale.min).toBe(5);
- expect(scale.max).toBe(5000);
+ scale.update(400, 400);
+ expect(scale.min).toBe(1);
+ expect(scale.max).toBe(10000);
});
it('Should correctly determine the max & min for scatter data', function() {
}]
};
+ var mockContext = window.createMockContext();
var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var verticalScale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: config,
data: mockData,
id: scaleID
});
- verticalScale.calculateRange();
- expect(verticalScale.min).toBe(6);
- expect(verticalScale.max).toBe(121);
+ verticalScale.update(400, 400);
+ expect(verticalScale.min).toBe(1);
+ expect(verticalScale.max).toBe(1000);
var horizontalConfig = Chart.helpers.clone(config);
horizontalConfig.position = 'bottom';
var horizontalScale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: horizontalConfig,
data: mockData,
id: scaleID,
});
- horizontalScale.calculateRange();
- expect(horizontalScale.min).toBe(2);
- expect(horizontalScale.max).toBe(99);
+ horizontalScale.update(400, 400);
+ expect(horizontalScale.min).toBe(1);
+ expect(horizontalScale.max).toBe(100);
});
it('Should correctly determine the min and max data values when stacked mode is turned on', function() {
var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
config.stacked = true; // enable scale stacked mode
+ var mockContext = window.createMockContext();
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var scale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: config,
data: mockData,
id: scaleID
});
- scale.calculateRange();
- expect(scale.min).toBe(11);
- expect(scale.max).toBe(160);
+ scale.update(400, 400);
+ expect(scale.min).toBe(10);
+ expect(scale.max).toBe(1000);
});
it('Should ensure that the scale has a max and min that are not equal', function() {
datasets: []
};
+ var mockContext = window.createMockContext();
var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var scale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: config,
data: mockData,
id: scaleID
});
- scale.calculateRange();
+ scale.update(400, 00);
expect(scale.min).toBe(1);
expect(scale.max).toBe(10);
data: [0.15, 0.15]
}];
- scale.calculateRange();
+ scale.update(400, 400);
expect(scale.min).toBe(0.01);
expect(scale.max).toBe(1);
});
id: scaleID
});
- scale.calculateRange();
- expect(scale.ticks).toBe(undefined); // not set
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
- // Large enough to be unimportant
- var maxWidth = 400;
- var maxHeight = 400;
- scale.generateTicks(maxWidth, maxHeight);
+ scale.buildTicks();
// Counts down because the lines are drawn top to bottom
expect(scale.ticks).toEqual([100, 90, 80, 70, 60, 50, 40, 30, 20, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1]);
};
var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- config.reverse = true;
+ config.ticks.reverse = true;
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var scale = new Constructor({
id: scaleID
});
- scale.calculateRange();
- expect(scale.ticks).toBe(undefined); // not set
+ // Set arbitrary width and height for now
+ scale.width = 50;
+ scale.height = 400;
- // Large enough to be unimportant
- var maxWidth = 400;
- var maxHeight = 400;
- scale.generateTicks(maxWidth, maxHeight);
+ scale.buildTicks();
// Counts down because the lines are drawn top to bottom
expect(scale.ticks).toEqual([1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100]);
expect(scale.end).toBe(1);
});
- it('Should generate tick marks using the user supplied options', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- yAxisID: scaleID,
- data: [10, 5, 0, 25, 78]
- }, ]
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- config.override = {
- steps: 9,
- start: 1,
- stepWidth: 1
- };
-
- var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
- var scale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
-
- scale.calculateRange();
-
- // Large enough to be unimportant
- var maxWidth = 400;
- var maxHeight = 400;
- scale.generateTicks(maxWidth, maxHeight);
-
- expect(scale.ticks).toEqual([10, 9, 8, 7, 6, 5, 4, 3, 2, 1]);
- expect(scale.start).toBe(1);
- expect(scale.end).toBe(10);
- });
-
it('Should build labels using the default template', function() {
var scaleID = 'myScale';
}, ]
};
+ var mockContext = window.createMockContext();
var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var scale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: config,
data: mockData,
id: scaleID
});
- scale.calculateRange();
-
- // Large enough to be unimportant
- var maxWidth = 400;
- var maxHeight = 400;
- scale.generateTicks(maxWidth, maxHeight);
-
- // Generate labels
- scale.buildLabels();
+ scale.update(400, 400);
- expect(scale.labels).toEqual(['1e+2', '', '', '', '', '5e+1', '', '', '2e+1', '1e+1', '', '', '', '', '5e+0', '', '', '2e+0', '1e+0']);
+ expect(scale.ticks).toEqual(['1e+2', '', '', '', '', '5e+1', '', '', '2e+1', '1e+1', '', '', '', '', '5e+0', '', '', '2e+0', '1e+0']);
});
it('Should build labels using the user supplied callback', function() {
};
var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- config.labels.userCallback = function(value, index) {
+ config.ticks.userCallback = function(value, index) {
return index.toString();
};
+ var mockContext = window.createMockContext();
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var scale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: config,
data: mockData,
id: scaleID
});
- scale.calculateRange();
-
- // Large enough to be unimportant
- var maxWidth = 400;
- var maxHeight = 400;
- scale.generateTicks(maxWidth, maxHeight);
-
- // Generate labels
- scale.buildLabels();
+ scale.update(400, 400);
// Just the index
- expect(scale.labels).toEqual(['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18']);
+ expect(scale.ticks).toEqual(['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18']);
});
it('Should get the correct pixel value for a point', function() {
}]
};
+ var mockContext = window.createMockContext();
var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
var verticalScale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: config,
data: mockData,
id: scaleID
});
- verticalScale.calculateRange();
- verticalScale.generateTicks(50, 100);
+ verticalScale.update(50, 100);
// Fake out positioning of the scale service
verticalScale.left = 0;
verticalScale.width = 50;
verticalScale.height = 110;
- expect(verticalScale.getPointPixelForValue(100, 0, 0)).toBe(5); // top + paddingTop
- expect(verticalScale.getPointPixelForValue(1, 0, 0)).toBe(105); // bottom - paddingBottom
- expect(verticalScale.getPointPixelForValue(10, 0, 0)).toBe(55); // halfway
+ expect(verticalScale.getPixelForValue(100, 0, 0)).toBe(5); // top + paddingTop
+ expect(verticalScale.getPixelForValue(1, 0, 0)).toBe(105); // bottom - paddingBottom
+ expect(verticalScale.getPixelForValue(10, 0, 0)).toBe(55); // halfway
var horizontalConfig = Chart.helpers.clone(config);
horizontalConfig.position = 'bottom';
var horizontalScale = new Constructor({
- ctx: {},
+ ctx: mockContext,
options: horizontalConfig,
data: mockData,
id: scaleID,
});
- horizontalScale.calculateRange();
- horizontalScale.generateTicks(100, 50);
+ horizontalScale.update(100, 50);
// Fake out positioning of the scale service
horizontalScale.left = 0;
horizontalScale.width = 110;
horizontalScale.height = 50;
- // Range expands to [-2, 2] due to nicenum algorithm
- expect(horizontalScale.getPointPixelForValue(100, 0, 0)).toBe(105); // right - paddingRight
- expect(horizontalScale.getPointPixelForValue(1, 0, 0)).toBe(5); // left + paddingLeft
- expect(horizontalScale.getPointPixelForValue(10, 0, 0)).toBe(55); // halfway
- });
-
- it('should get the correct pixel value for a bar', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [10, 5, 1, 25, 78]
- }]
- };
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
- var verticalScale = new Constructor({
- ctx: {},
- options: config,
- data: mockData,
- id: scaleID
- });
-
- verticalScale.calculateRange();
- verticalScale.generateTicks(50, 100);
-
- // Fake out positioning of the scale service
- verticalScale.left = 0;
- verticalScale.top = 0;
- verticalScale.right = 50;
- verticalScale.bottom = 110;
- verticalScale.paddingTop = 5;
- verticalScale.paddingBottom = 5;
- verticalScale.width = 50;
- verticalScale.height = 110;
-
- expect(verticalScale.calculateBarBase()).toBe(105); // bottom
- expect(verticalScale.calculateBarY(0, 3)).toBe(35.10299956639811); // bottom
- });
-
- it('should fit correctly', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [10, 5, 1, 25, 78]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
- var verticalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = verticalScale.fit(100, 300);
- expect(minSize).toEqual({
- width: 53,
- height: 300,
- });
- expect(verticalScale.width).toBe(53);
- expect(verticalScale.height).toBe(300);
- expect(verticalScale.paddingTop).toBe(6);
- expect(verticalScale.paddingBottom).toBe(6);
- expect(verticalScale.paddingLeft).toBe(0);
- expect(verticalScale.paddingRight).toBe(0);
-
- // Refit with margins to see the padding go away
- minSize = verticalScale.fit(53, 300, {
- left: 0,
- right: 0,
- top: 15,
- bottom: 3
- });
- expect(minSize).toEqual({
- width: 53,
- height: 300,
- });
- expect(verticalScale.paddingTop).toBe(0);
- expect(verticalScale.paddingBottom).toBe(3);
- expect(verticalScale.paddingLeft).toBe(0);
- expect(verticalScale.paddingRight).toBe(0);
-
- config.scaleLabel.show = true;
- minSize = verticalScale.fit(100, 300);
- expect(minSize).toEqual({
- width: 71,
- height: 300,
- });
- });
-
- it('should fit correctly when horizontal', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [10, 5, 1, 25, 78]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- config.position = "bottom";
- var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
- var verticalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = verticalScale.fit(100, 300);
- expect(minSize).toEqual({
- width: 100,
- height: 28,
- });
- expect(verticalScale.width).toBe(100);
- expect(verticalScale.height).toBe(28);
- expect(verticalScale.paddingTop).toBe(0);
- expect(verticalScale.paddingBottom).toBe(0);
- expect(verticalScale.paddingLeft).toBe(20);
- expect(verticalScale.paddingRight).toBe(20);
-
- // Refit with margins to see the padding go away
- minSize = verticalScale.fit(100, 28, {
- left: 10,
- right: 6,
- top: 15,
- bottom: 3
- });
- expect(minSize).toEqual({
- width: 100,
- height: 28,
- });
- expect(verticalScale.paddingTop).toBe(0);
- expect(verticalScale.paddingBottom).toBe(0);
- expect(verticalScale.paddingLeft).toBe(10);
- expect(verticalScale.paddingRight).toBe(14);
-
- config.scaleLabel.show = true;
- minSize = verticalScale.fit(100, 300);
- expect(minSize).toEqual({
- width: 100,
- height: 46,
- });
- });
-
- it('should draw correctly horizontally', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [10, 5, 1, 25, 78]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- config.position = "bottom";
- var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
- var horizontalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = horizontalScale.fit(100, 300);
- minSize = horizontalScale.fit(100, 28, {
- left: 10,
- right: 6,
- top: 15,
- bottom: 3
- });
-
- horizontalScale.left = 0;
- horizontalScale.right = minSize.width;
- horizontalScale.top = 0;
- horizontalScale.bottom = minSize.height;
-
- var chartArea = {
- top: 100,
- bottom: 0,
- left: 0,
- right: minSize.width
- };
- horizontalScale.draw(chartArea);
-
- expect(mockContext.getCalls()).toEqual([{
- "name": "measureText",
- "args": ["1e+0"]
- }, {
- "name": "measureText",
- "args": ["1e+2"]
- }, {
- "name": "measureText",
- "args": ["1e+0"]
- }, {
- "name": "measureText",
- "args": ["1e+2"]
- }, {
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [10.5, 0]
- }, {
- "name": "lineTo",
- "args": [10.5, 5]
- }, {
- "name": "moveTo",
- "args": [10.5, 100]
- }, {
- "name": "lineTo",
- "args": [10.5, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [21.939139835231288, 0]
- }, {
- "name": "lineTo",
- "args": [21.939139835231288, 5]
- }, {
- "name": "moveTo",
- "args": [21.939139835231288, 100]
- }, {
- "name": "lineTo",
- "args": [21.939139835231288, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28.63060767934717, 0]
- }, {
- "name": "lineTo",
- "args": [28.63060767934717, 5]
- }, {
- "name": "moveTo",
- "args": [28.63060767934717, 100]
- }, {
- "name": "lineTo",
- "args": [28.63060767934717, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [33.378279670462575, 0]
- }, {
- "name": "lineTo",
- "args": [33.378279670462575, 5]
- }, {
- "name": "moveTo",
- "args": [33.378279670462575, 100]
- }, {
- "name": "lineTo",
- "args": [33.378279670462575, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [37.06086016476871, 0]
- }, {
- "name": "lineTo",
- "args": [37.06086016476871, 5]
- }, {
- "name": "moveTo",
- "args": [37.06086016476871, 100]
- }, {
- "name": "lineTo",
- "args": [37.06086016476871, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [40.06974751457846, 0]
- }, {
- "name": "lineTo",
- "args": [40.06974751457846, 5]
- }, {
- "name": "moveTo",
- "args": [40.06974751457846, 100]
- }, {
- "name": "lineTo",
- "args": [40.06974751457846, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [42.613725520541756, 0]
- }, {
- "name": "lineTo",
- "args": [42.613725520541756, 5]
- }, {
- "name": "moveTo",
- "args": [42.613725520541756, 100]
- }, {
- "name": "lineTo",
- "args": [42.613725520541756, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [44.817419505693856, 0]
- }, {
- "name": "lineTo",
- "args": [44.817419505693856, 5]
- }, {
- "name": "moveTo",
- "args": [44.817419505693856, 100]
- }, {
- "name": "lineTo",
- "args": [44.817419505693856, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [46.76121535869434, 0]
- }, {
- "name": "lineTo",
- "args": [46.76121535869434, 5]
- }, {
- "name": "moveTo",
- "args": [46.76121535869434, 100]
- }, {
- "name": "lineTo",
- "args": [46.76121535869434, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [48.5, 0]
- }, {
- "name": "lineTo",
- "args": [48.5, 5]
- }, {
- "name": "moveTo",
- "args": [48.5, 100]
- }, {
- "name": "lineTo",
- "args": [48.5, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [59.93913983523129, 0]
- }, {
- "name": "lineTo",
- "args": [59.93913983523129, 5]
- }, {
- "name": "moveTo",
- "args": [59.93913983523129, 100]
- }, {
- "name": "lineTo",
- "args": [59.93913983523129, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [66.63060767934718, 0]
- }, {
- "name": "lineTo",
- "args": [66.63060767934718, 5]
- }, {
- "name": "moveTo",
- "args": [66.63060767934718, 100]
- }, {
- "name": "lineTo",
- "args": [66.63060767934718, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [71.37827967046258, 0]
- }, {
- "name": "lineTo",
- "args": [71.37827967046258, 5]
- }, {
- "name": "moveTo",
- "args": [71.37827967046258, 100]
- }, {
- "name": "lineTo",
- "args": [71.37827967046258, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [75.06086016476871, 0]
- }, {
- "name": "lineTo",
- "args": [75.06086016476871, 5]
- }, {
- "name": "moveTo",
- "args": [75.06086016476871, 100]
- }, {
- "name": "lineTo",
- "args": [75.06086016476871, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [78.06974751457845, 0]
- }, {
- "name": "lineTo",
- "args": [78.06974751457845, 5]
- }, {
- "name": "moveTo",
- "args": [78.06974751457845, 100]
- }, {
- "name": "lineTo",
- "args": [78.06974751457845, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [80.61372552054176, 0]
- }, {
- "name": "lineTo",
- "args": [80.61372552054176, 5]
- }, {
- "name": "moveTo",
- "args": [80.61372552054176, 100]
- }, {
- "name": "lineTo",
- "args": [80.61372552054176, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [82.81741950569385, 0]
- }, {
- "name": "lineTo",
- "args": [82.81741950569385, 5]
- }, {
- "name": "moveTo",
- "args": [82.81741950569385, 100]
- }, {
- "name": "lineTo",
- "args": [82.81741950569385, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [84.76121535869434, 0]
- }, {
- "name": "lineTo",
- "args": [84.76121535869434, 5]
- }, {
- "name": "moveTo",
- "args": [84.76121535869434, 100]
- }, {
- "name": "lineTo",
- "args": [84.76121535869434, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [86.5, 0]
- }, {
- "name": "lineTo",
- "args": [86.5, 5]
- }, {
- "name": "moveTo",
- "args": [86.5, 100]
- }, {
- "name": "lineTo",
- "args": [86.5, 0]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "fillText",
- "args": ["1e+0", 10, 10]
- }, {
- "name": "fillText",
- "args": ["2e+0", 21.439139835231288, 10]
- }, {
- "name": "fillText",
- "args": ["5e+0", 36.56086016476871, 10]
- }, {
- "name": "fillText",
- "args": ["1e+1", 48, 10]
- }, {
- "name": "fillText",
- "args": ["2e+1", 59.43913983523129, 10]
- }, {
- "name": "fillText",
- "args": ["5e+1", 74.56086016476871, 10]
- }, {
- "name": "fillText",
- "args": ["1e+2", 86, 10]
- }]);
-
- // Turn off some drawing
- config.gridLines.drawTicks = false;
- config.gridLines.drawOnChartArea = false;
- config.labels.show = false;
- config.scaleLabel.show = true;
- config.scaleLabel.labelString = 'my label';
-
- mockContext.resetCalls();
-
- horizontalScale.draw();
- expect(mockContext.getCalls()).toEqual([{
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "fillText",
- "args": ["my label", 50, 22]
- }]);
-
- // Turn off display
-
- mockContext.resetCalls();
- config.display = false;
- horizontalScale.draw();
- expect(mockContext.getCalls()).toEqual([]);
- });
-
- it('should draw correctly vertically', function() {
- var scaleID = 'myScale';
-
- var mockData = {
- datasets: [{
- xAxisID: scaleID, // for the horizontal scale
- yAxisID: scaleID,
- data: [10, 5, 1, 2.5, 7.8]
- }]
- };
- var mockContext = window.createMockContext();
-
- var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('logarithmic'));
- var Constructor = Chart.scaleService.getScaleConstructor('logarithmic');
- var verticalScale = new Constructor({
- ctx: mockContext,
- options: config,
- data: mockData,
- id: scaleID
- });
-
- var minSize = verticalScale.fit(100, 300);
- minSize = verticalScale.fit(33, 300, {
- left: 0,
- right: 0,
- top: 15,
- bottom: 3
- });
- expect(minSize).toEqual({
- width: 33,
- height: 300,
- });
-
- verticalScale.left = 0;
- verticalScale.right = minSize.width;
- verticalScale.top = 0;
- verticalScale.bottom = minSize.height;
-
- var chartArea = {
- top: 0,
- bottom: minSize.height,
- left: minSize.width,
- right: minSize.width + 100
- };
- verticalScale.draw(chartArea);
-
- var expected = [{
- "name": "measureText",
- "args": ["1e+1"]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": ["5e+0"]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": ["2e+0"]
- }, {
- "name": "measureText",
- "args": ["1e+0"]
- }, {
- "name": "measureText",
- "args": ["1e+1"]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": ["5e+0"]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": [""]
- }, {
- "name": "measureText",
- "args": ["2e+0"]
- }, {
- "name": "measureText",
- "args": ["1e+0"]
- }, {
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 0.5]
- }, {
- "name": "lineTo",
- "args": [33, 0.5]
- }, {
- "name": "moveTo",
- "args": [33, 0.5]
- }, {
- "name": "lineTo",
- "args": [133, 0.5]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 14.089974696520528]
- }, {
- "name": "lineTo",
- "args": [33, 14.089974696520528]
- }, {
- "name": "moveTo",
- "args": [33, 14.089974696520528]
- }, {
- "name": "lineTo",
- "args": [133, 14.089974696520528]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 29.28227386339279]
- }, {
- "name": "lineTo",
- "args": [33, 29.28227386339279]
- }, {
- "name": "moveTo",
- "args": [33, 29.28227386339279]
- }, {
- "name": "lineTo",
- "args": [133, 29.28227386339279]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 46.50588211576573]
- }, {
- "name": "lineTo",
- "args": [33, 46.50588211576573]
- }, {
- "name": "moveTo",
- "args": [33, 46.50588211576573]
- }, {
- "name": "lineTo",
- "args": [133, 46.50588211576573]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 66.38907863605783]
- }, {
- "name": "lineTo",
- "args": [33, 66.38907863605783]
- }, {
- "name": "moveTo",
- "args": [33, 66.38907863605783]
- }, {
- "name": "lineTo",
- "args": [133, 66.38907863605783]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 89.9059087122024]
- }, {
- "name": "lineTo",
- "args": [33, 89.9059087122024]
- }, {
- "name": "moveTo",
- "args": [33, 89.9059087122024]
- }, {
- "name": "lineTo",
- "args": [133, 89.9059087122024]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 118.68818257559516]
- }, {
- "name": "lineTo",
- "args": [33, 118.68818257559516]
- }, {
- "name": "moveTo",
- "args": [33, 118.68818257559516]
- }, {
- "name": "lineTo",
- "args": [133, 118.68818257559516]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 155.79498734826026]
- }, {
- "name": "lineTo",
- "args": [33, 155.79498734826026]
- }, {
- "name": "moveTo",
- "args": [33, 155.79498734826026]
- }, {
- "name": "lineTo",
- "args": [133, 155.79498734826026]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 208.0940912877976]
- }, {
- "name": "lineTo",
- "args": [33, 208.0940912877976]
- }, {
- "name": "moveTo",
- "args": [33, 208.0940912877976]
- }, {
- "name": "lineTo",
- "args": [133, 208.0940912877976]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "moveTo",
- "args": [28, 297.5]
- }, {
- "name": "lineTo",
- "args": [33, 297.5]
- }, {
- "name": "moveTo",
- "args": [33, 297.5]
- }, {
- "name": "lineTo",
- "args": [133, 297.5]
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "fillText",
- "args": ["1e+1", 23, 0]
- }, {
- "name": "fillText",
- "args": ["", 23, 13.589974696520528]
- }, {
- "name": "fillText",
- "args": ["", 23, 28.78227386339279]
- }, {
- "name": "fillText",
- "args": ["", 23, 46.00588211576573]
- }, {
- "name": "fillText",
- "args": ["", 23, 65.88907863605783]
- }, {
- "name": "fillText",
- "args": ["5e+0", 23, 89.4059087122024]
- }, {
- "name": "fillText",
- "args": ["", 23, 118.18818257559516]
- }, {
- "name": "fillText",
- "args": ["", 23, 155.29498734826026]
- }, {
- "name": "fillText",
- "args": ["2e+0", 23, 207.5940912877976]
- }, {
- "name": "fillText",
- "args": ["1e+0", 23, 297]
- }];
- expect(mockContext.getCalls()).toEqual(expected);
-
- // Turn off some drawing
- config.gridLines.drawTicks = false;
- config.gridLines.drawOnChartArea = false;
- config.labels.show = false;
- config.scaleLabel.show = true;
- config.scaleLabel.labelString = 'my label';
-
- mockContext.resetCalls();
-
- verticalScale.draw();
- expect(mockContext.getCalls()).toEqual([{
- "name": "setFillStyle",
- "args": ["#666"]
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0,0,0,0.25)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "setLineWidth",
- "args": [1]
- }, {
- "name": "setStrokeStyle",
- "args": ["rgba(0, 0, 0, 0.1)"]
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "beginPath",
- "args": []
- }, {
- "name": "stroke",
- "args": []
- }, {
- "name": "save",
- "args": []
- }, {
- "name": "translate",
- "args": [6, 150]
- }, {
- "name": "rotate",
- "args": [-1.5707963267948966]
- }, {
- "name": "fillText",
- "args": ["my label", 0, 0]
- }, {
- "name": "restore",
- "args": []
- }]);
+ expect(horizontalScale.getPixelForValue(100, 0, 0)).toBe(105); // right - paddingRight
+ expect(horizontalScale.getPixelForValue(1, 0, 0)).toBe(5); // left + paddingLeft
+ expect(horizontalScale.getPixelForValue(10, 0, 0)).toBe(55); // halfway
});
});
\ No newline at end of file