]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Remove unnecessary padding usages and update category scale tests
authoretimberg <evert.timberg@gmail.com>
Sun, 30 Oct 2016 17:14:59 +0000 (13:14 -0400)
committerEvert Timberg <evert.timberg+github@gmail.com>
Fri, 18 Nov 2016 22:58:07 +0000 (17:58 -0500)
src/scales/scale.category.js
src/scales/scale.linear.js
src/scales/scale.logarithmic.js
src/scales/scale.time.js
test/scale.category.tests.js

index fb90e6333f1e9cb4afe9f79403034f500d0ae937..8a65cb2e7a0456a0467d356e3ffae90830533c4e 100644 (file)
@@ -73,9 +73,8 @@ module.exports = function(Chart) {
                        }
 
                        if (me.isHorizontal()) {
-                               var innerWidth = me.width - (me.paddingLeft + me.paddingRight);
-                               var valueWidth = innerWidth / offsetAmt;
-                               var widthOffset = (valueWidth * (index - me.minIndex)) + me.paddingLeft;
+                               var valueWidth = me.width / offsetAmt;
+                               var widthOffset = (valueWidth * (index - me.minIndex));
 
                                if (me.options.gridLines.offsetGridLines && includeOffset || me.maxIndex === me.minIndex && includeOffset) {
                                        widthOffset += (valueWidth / 2);
@@ -83,9 +82,8 @@ module.exports = function(Chart) {
 
                                return me.left + Math.round(widthOffset);
                        }
-                       var innerHeight = me.height - (me.paddingTop + me.paddingBottom);
-                       var valueHeight = innerHeight / offsetAmt;
-                       var heightOffset = (valueHeight * (index - me.minIndex)) + me.paddingTop;
+                       var valueHeight = me.height / offsetAmt;
+                       var heightOffset = (valueHeight * (index - me.minIndex));
 
                        if (me.options.gridLines.offsetGridLines && includeOffset) {
                                heightOffset += (valueHeight / 2);
@@ -101,15 +99,13 @@ module.exports = function(Chart) {
                        var value;
                        var offsetAmt = Math.max((me.ticks.length - ((me.options.gridLines.offsetGridLines) ? 0 : 1)), 1);
                        var horz = me.isHorizontal();
-                       var innerDimension = horz ? me.width - (me.paddingLeft + me.paddingRight) : me.height - (me.paddingTop + me.paddingBottom);
-                       var valueDimension = innerDimension / offsetAmt;
+                       var valueDimension = (horz ? me.width : me.height) / offsetAmt;
 
                        pixel -= horz ? me.left : me.top;
 
                        if (me.options.gridLines.offsetGridLines) {
                                pixel -= (valueDimension / 2);
                        }
-                       pixel -= horz ? me.paddingLeft : me.paddingTop;
 
                        if (pixel <= 0) {
                                value = 0;
index e8afa84f8f12f839169fe145b09eaacd2415bbcf..301af6bc98690d78e7f206e18300aab2f0825ff1 100644 (file)
@@ -132,31 +132,25 @@ module.exports = function(Chart) {
                        // This must be called after fit has been run so that
                        // this.left, this.top, this.right, and this.bottom have been defined
                        var me = this;
-                       var paddingLeft = me.paddingLeft;
-                       var paddingBottom = me.paddingBottom;
                        var start = me.start;
 
                        var rightValue = +me.getRightValue(value);
                        var pixel;
-                       var innerDimension;
                        var range = me.end - start;
 
                        if (me.isHorizontal()) {
-                               innerDimension = me.width - (paddingLeft + me.paddingRight);
-                               pixel = me.left + (innerDimension / range * (rightValue - start));
-                               return Math.round(pixel + paddingLeft);
+                               pixel = me.left + (me.width / range * (rightValue - start));
+                               return Math.round(pixel);
                        }
-                       innerDimension = me.height - (me.paddingTop + paddingBottom);
-                       pixel = (me.bottom - paddingBottom) - (innerDimension / range * (rightValue - start));
+
+                       pixel = me.bottom - (me.height / range * (rightValue - start));
                        return Math.round(pixel);
                },
                getValueForPixel: function(pixel) {
                        var me = this;
                        var isHorizontal = me.isHorizontal();
-                       var paddingLeft = me.paddingLeft;
-                       var paddingBottom = me.paddingBottom;
-                       var innerDimension = isHorizontal ? me.width - (paddingLeft + me.paddingRight) : me.height - (me.paddingTop + paddingBottom);
-                       var offset = (isHorizontal ? pixel - me.left - paddingLeft : me.bottom - paddingBottom - pixel) / innerDimension;
+                       var innerDimension = isHorizontal ? me.width : me.height;
+                       var offset = (isHorizontal ? pixel - me.left : me.bottom - pixel) / innerDimension;
                        return me.start + ((me.end - me.start) * offset);
                },
                getPixelForTick: function(index) {
index 9d87459406a832f60e811455e5b032f6d9fca7ca..160d35f23fdda9b825cdb20aa3d19395c71942b6 100644 (file)
@@ -162,46 +162,42 @@ module.exports = function(Chart) {
                        var start = me.start;
                        var newVal = +me.getRightValue(value);
                        var range;
-                       var paddingTop = me.paddingTop;
-                       var paddingBottom = me.paddingBottom;
-                       var paddingLeft = me.paddingLeft;
                        var opts = me.options;
                        var tickOpts = opts.ticks;
 
                        if (me.isHorizontal()) {
                                range = helpers.log10(me.end) - helpers.log10(start); // todo: if start === 0
                                if (newVal === 0) {
-                                       pixel = me.left + paddingLeft;
+                                       pixel = me.left;
                                } else {
-                                       innerDimension = me.width - (paddingLeft + me.paddingRight);
+                                       innerDimension = me.width;
                                        pixel = me.left + (innerDimension / range * (helpers.log10(newVal) - helpers.log10(start)));
-                                       pixel += paddingLeft;
                                }
                        } else {
                                // Bottom - top since pixels increase downward on a screen
-                               innerDimension = me.height - (paddingTop + paddingBottom);
+                               innerDimension = me.height;
                                if (start === 0 && !tickOpts.reverse) {
                                        range = helpers.log10(me.end) - helpers.log10(me.minNotZero);
                                        if (newVal === start) {
-                                               pixel = me.bottom - paddingBottom;
+                                               pixel = me.bottom;
                                        } else if (newVal === me.minNotZero) {
-                                               pixel = me.bottom - paddingBottom - innerDimension * 0.02;
+                                               pixel = me.bottom - innerDimension * 0.02;
                                        } else {
-                                               pixel = me.bottom - paddingBottom - innerDimension * 0.02 - (innerDimension * 0.98/ range * (helpers.log10(newVal)-helpers.log10(me.minNotZero)));
+                                               pixel = me.bottom - innerDimension * 0.02 - (innerDimension * 0.98/ range * (helpers.log10(newVal)-helpers.log10(me.minNotZero)));
                                        }
                                } else if (me.end === 0 && tickOpts.reverse) {
                                        range = helpers.log10(me.start) - helpers.log10(me.minNotZero);
                                        if (newVal === me.end) {
-                                               pixel = me.top + paddingTop;
+                                               pixel = me.top;
                                        } else if (newVal === me.minNotZero) {
-                                               pixel = me.top + paddingTop + innerDimension * 0.02;
+                                               pixel = me.top + innerDimension * 0.02;
                                        } else {
-                                               pixel = me.top + paddingTop + innerDimension * 0.02 + (innerDimension * 0.98/ range * (helpers.log10(newVal)-helpers.log10(me.minNotZero)));
+                                               pixel = me.top + innerDimension * 0.02 + (innerDimension * 0.98/ range * (helpers.log10(newVal)-helpers.log10(me.minNotZero)));
                                        }
                                } else {
                                        range = helpers.log10(me.end) - helpers.log10(start);
-                                       innerDimension = me.height - (paddingTop + paddingBottom);
-                                       pixel = (me.bottom - paddingBottom) - (innerDimension / range * (helpers.log10(newVal) - helpers.log10(start)));
+                                       innerDimension = me.height;
+                                       pixel = me.bottom - (innerDimension / range * (helpers.log10(newVal) - helpers.log10(start)));
                                }
                        }
                        return pixel;
@@ -212,11 +208,11 @@ module.exports = function(Chart) {
                        var value, innerDimension;
 
                        if (me.isHorizontal()) {
-                               innerDimension = me.width - (me.paddingLeft + me.paddingRight);
-                               value = me.start * Math.pow(10, (pixel - me.left - me.paddingLeft) * range / innerDimension);
+                               innerDimension = me.width;
+                               value = me.start * Math.pow(10, (pixel - me.left) * range / innerDimension);
                        } else {  // todo: if start === 0
-                               innerDimension = me.height - (me.paddingTop + me.paddingBottom);
-                               value = Math.pow(10, (me.bottom - me.paddingBottom - pixel) * range / innerDimension) / me.start;
+                               innerDimension = me.height;
+                               value = Math.pow(10, (me.bottom - pixel) * range / innerDimension) / me.start;
                        }
                        return value;
                }
index c69bcf21e7538b80c00b145e2b8b41a3a3ae1592..0057dd92aea654b534b933850426c1037e2084d6 100755 (executable)
@@ -240,7 +240,7 @@ module.exports = function(Chart) {
                                me.unitScale = helpers.getValueOrDefault(me.options.time.unitStepSize, 1);
                        } else {
                                // Determine the smallest needed unit of the time
-                               var innerWidth = me.isHorizontal() ? me.width - (me.paddingLeft + me.paddingRight) : me.height - (me.paddingTop + me.paddingBottom);
+                               var innerWidth = me.isHorizontal() ? me.width : me.height;
 
                                // Crude approximation of what the label length might be
                                var tempFirstLabel = me.tickFormatFunction(me.firstTick, 0, []);
@@ -409,14 +409,11 @@ module.exports = function(Chart) {
                                var decimal = offset !== 0 ? offset / me.scaleSizeInUnits : offset;
 
                                if (me.isHorizontal()) {
-                                       var innerWidth = me.width - (me.paddingLeft + me.paddingRight);
-                                       var valueOffset = (innerWidth * decimal) + me.paddingLeft;
-
+                                       var valueOffset = (me.width * decimal);
                                        return me.left + Math.round(valueOffset);
                                }
-                               var innerHeight = me.height - (me.paddingTop + me.paddingBottom);
-                               var heightOffset = (innerHeight * decimal) + me.paddingTop;
 
+                               var heightOffset = (me.height * decimal);
                                return me.top + Math.round(heightOffset);
                        }
                },
@@ -425,8 +422,8 @@ module.exports = function(Chart) {
                },
                getValueForPixel: function(pixel) {
                        var me = this;
-                       var innerDimension = me.isHorizontal() ? me.width - (me.paddingLeft + me.paddingRight) : me.height - (me.paddingTop + me.paddingBottom);
-                       var offset = (pixel - (me.isHorizontal() ? me.left + me.paddingLeft : me.top + me.paddingTop)) / innerDimension;
+                       var innerDimension = me.isHorizontal() ? me.width : me.height;
+                       var offset = (pixel - (me.isHorizontal() ? me.left : me.top)) / innerDimension;
                        offset *= me.scaleSizeInUnits;
                        return me.firstTick.clone().add(moment.duration(offset, me.tickUnit).asSeconds(), 'seconds');
                },
index 13955d35be4daecb6fbc3cc8ccce419d7a07290e..08cae8ba0b4096eba205a19f4a148599697b1d9d 100644 (file)
@@ -161,305 +161,226 @@ describe('Category scale tests', function() {
        });
 
        it ('Should get the correct pixel for a value when horizontal', function() {
-               var scaleID = 'myScale';
-
-               var mockData = {
-                       datasets: [{
-                               yAxisID: scaleID,
-                               data: [10, 5, 0, 25, 78]
-                       }],
-                       labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick_last']
-               };
-
-               var mockContext = window.createMockContext();
-               var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category'));
-               config.gridLines.offsetGridLines = true;
-               var Constructor = Chart.scaleService.getScaleConstructor('category');
-               var scale = new Constructor({
-                       ctx: mockContext,
-                       options: config,
-                       chart: {
-                               data: mockData
+               var chart = window.acquireChart({
+                       type: 'line',
+                       data: {
+                               datasets: [{
+                                       xAxisID: 'xScale0',
+                                       yAxisID: 'yScale0',
+                                       data: [10, 5, 0, 25, 78]
+                               }],
+                               labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick_last']
                        },
-                       id: scaleID
-               });
-
-               var minSize = scale.update(600, 100);
-
-               expect(scale.width).toBe(600);
-               expect(scale.height).toBe(28);
-               expect(scale.paddingTop).toBe(0);
-               expect(scale.paddingBottom).toBe(0);
-               expect(scale.paddingLeft).toBe(28);
-               expect(scale.paddingRight).toBe(48);
-               expect(scale.labelRotation).toBe(0);
-
-               expect(minSize).toEqual({
-                       width: 600,
-                       height: 28,
+                       options: {
+                               scales: {
+                                       xAxes: [{
+                                               id: 'xScale0',
+                                               type: 'category',
+                                               position: 'bottom'
+                                       }],
+                                       yAxes: [{
+                                               id: 'yScale0',
+                                               type: 'linear'
+                                       }]
+                               }
+                       }
                });
 
-               scale.left = 5;
-               scale.top = 5;
-               scale.right = 605;
-               scale.bottom = 33;
+               var xScale = chart.scales.xScale0;
+               expect(xScale.getPixelForValue(0, 0, 0, false)).toBeCloseToPixel(33);
+               expect(xScale.getPixelForValue(0, 0, 0, true)).toBeCloseToPixel(33);
+               expect(xScale.getValueForPixel(33)).toBe(0);
 
-               expect(scale.getPixelForValue(0, 0, 0, false)).toBe(33);
-               expect(scale.getPixelForValue(0, 0, 0, true)).toBe(85);
-               expect(scale.getValueForPixel(33)).toBe(0);
-               expect(scale.getValueForPixel(85)).toBe(0);
+               expect(xScale.getPixelForValue(0, 4, 0, false)).toBeCloseToPixel(487);
+               expect(xScale.getPixelForValue(0, 4, 0, true)).toBeCloseToPixel(487);
+               expect(xScale.getValueForPixel(487)).toBe(4);
 
-               expect(scale.getPixelForValue(0, 4, 0, false)).toBe(452);
-               expect(scale.getPixelForValue(0, 4, 0, true)).toBe(505);
-               expect(scale.getValueForPixel(453)).toBe(4);
-               expect(scale.getValueForPixel(505)).toBe(4);
+               xScale.options.gridLines.offsetGridLines = true;
 
-               config.gridLines.offsetGridLines = false;
+               expect(xScale.getPixelForValue(0, 0, 0, false)).toBeCloseToPixel(33);
+               expect(xScale.getPixelForValue(0, 0, 0, true)).toBeCloseToPixel(78);
+               expect(xScale.getValueForPixel(33)).toBe(0);
+               expect(xScale.getValueForPixel(78)).toBe(0);
 
-               expect(scale.getPixelForValue(0, 0, 0, false)).toBe(33);
-               expect(scale.getPixelForValue(0, 0, 0, true)).toBe(33);
-               expect(scale.getValueForPixel(33)).toBe(0);
-
-               expect(scale.getPixelForValue(0, 4, 0, false)).toBe(557);
-               expect(scale.getPixelForValue(0, 4, 0, true)).toBe(557);
-               expect(scale.getValueForPixel(557)).toBe(4);
+               expect(xScale.getPixelForValue(0, 4, 0, false)).toBeCloseToPixel(396);
+               expect(xScale.getPixelForValue(0, 4, 0, true)).toBeCloseToPixel(441);
+               expect(xScale.getValueForPixel(397)).toBe(4);
+               expect(xScale.getValueForPixel(441)).toBe(4);
        });
 
        it ('Should get the correct pixel for a value when there are repeated labels', function() {
-               var scaleID = 'myScale';
-
-               var mockData = {
-                       datasets: [{
-                               yAxisID: scaleID,
-                               data: [10, 5, 0, 25, 78]
-                       }],
-                       labels: ['tick1', 'tick1', 'tick3', 'tick3', 'tick_last']
-               };
-
-               var mockContext = window.createMockContext();
-               var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category'));
-               config.gridLines.offsetGridLines = true;
-               var Constructor = Chart.scaleService.getScaleConstructor('category');
-               var scale = new Constructor({
-                       ctx: mockContext,
-                       options: config,
-                       chart: {
-                               data: mockData
+               var chart = window.acquireChart({
+                       type: 'line',
+                       data: {
+                               datasets: [{
+                                       xAxisID: 'xScale0',
+                                       yAxisID: 'yScale0',
+                                       data: [10, 5, 0, 25, 78]
+                               }],
+                               labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick_last']
                        },
-                       id: scaleID
-               });
-
-               var minSize = scale.update(600, 100);
-
-               expect(scale.width).toBe(600);
-               expect(scale.height).toBe(28);
-               expect(scale.paddingTop).toBe(0);
-               expect(scale.paddingBottom).toBe(0);
-               expect(scale.paddingLeft).toBe(28);
-               expect(scale.paddingRight).toBe(48);
-               expect(scale.labelRotation).toBe(0);
-
-               expect(minSize).toEqual({
-                       width: 600,
-                       height: 28,
+                       options: {
+                               scales: {
+                                       xAxes: [{
+                                               id: 'xScale0',
+                                               type: 'category',
+                                               position: 'bottom'
+                                       }],
+                                       yAxes: [{
+                                               id: 'yScale0',
+                                               type: 'linear'
+                                       }]
+                               }
+                       }
                });
 
-               scale.left = 5;
-               scale.top = 5;
-               scale.right = 605;
-               scale.bottom = 33;
-
-               expect(scale.getPixelForValue('tick_1', 1, 0, false)).toBe(138);
-               expect(scale.getPixelForValue('tick_1', 1, 0, true)).toBe(190);
+               var xScale = chart.scales.xScale0;
+               expect(xScale.getPixelForValue('tick_1', 0, 0, false)).toBeCloseToPixel(33);
+               expect(xScale.getPixelForValue('tick_1', 1, 0, false)).toBeCloseToPixel(146);
        });
 
        it ('Should get the correct pixel for a value when horizontal and zoomed', function() {
-               var scaleID = 'myScale';
-
-               var mockData = {
-                       datasets: [{
-                               yAxisID: scaleID,
-                               data: [10, 5, 0, 25, 78]
-                       }],
-                       labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick_last']
-               };
-
-               var mockContext = window.createMockContext();
-               var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category'));
-               config.gridLines.offsetGridLines = true;
-               config.ticks.min = 'tick2';
-               config.ticks.max = 'tick4';
-
-               var Constructor = Chart.scaleService.getScaleConstructor('category');
-               var scale = new Constructor({
-                       ctx: mockContext,
-                       options: config,
-                       chart: {
-                               data: mockData
+               var chart = window.acquireChart({
+                       type: 'line',
+                       data: {
+                               datasets: [{
+                                       xAxisID: 'xScale0',
+                                       yAxisID: 'yScale0',
+                                       data: [10, 5, 0, 25, 78]
+                               }],
+                               labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick_last']
                        },
-                       id: scaleID
-               });
-
-               var minSize = scale.update(600, 100);
-
-               expect(scale.width).toBe(600);
-               expect(scale.height).toBe(28);
-               expect(scale.paddingTop).toBe(0);
-               expect(scale.paddingBottom).toBe(0);
-               expect(scale.paddingLeft).toBe(28);
-               expect(scale.paddingRight).toBe(28);
-               expect(scale.labelRotation).toBe(0);
-
-               expect(minSize).toEqual({
-                       width: 600,
-                       height: 28,
+                       options: {
+                               scales: {
+                                       xAxes: [{
+                                               id: 'xScale0',
+                                               type: 'category',
+                                               position: 'bottom',
+                                               ticks: {
+                                                       min: 'tick2',
+                                                       max: 'tick4'
+                                               }
+                                       }],
+                                       yAxes: [{
+                                               id: 'yScale0',
+                                               type: 'linear'
+                                       }]
+                               }
+                       }
                });
 
-               scale.left = 5;
-               scale.top = 5;
-               scale.right = 605;
-               scale.bottom = 33;
-
-               expect(scale.getPixelForValue(0, 1, 0, false)).toBe(33);
-               expect(scale.getPixelForValue(0, 1, 0, true)).toBe(124);
+               var xScale = chart.scales.xScale0;
+               expect(xScale.getPixelForValue(0, 1, 0, false)).toBeCloseToPixel(33);
+               expect(xScale.getPixelForValue(0, 1, 0, true)).toBeCloseToPixel(33);
 
-               expect(scale.getPixelForValue(0, 3, 0, false)).toBe(396);
-               expect(scale.getPixelForValue(0, 3, 0, true)).toBe(486);
+               expect(xScale.getPixelForValue(0, 3, 0, false)).toBeCloseToPixel(496);
+               expect(xScale.getPixelForValue(0, 3, 0, true)).toBeCloseToPixel(496);
 
-               config.gridLines.offsetGridLines = false;
+               xScale.options.gridLines.offsetGridLines = true;
 
-               expect(scale.getPixelForValue(0, 1, 0, false)).toBe(33);
-               expect(scale.getPixelForValue(0, 1, 0, true)).toBe(33);
+               expect(xScale.getPixelForValue(0, 1, 0, false)).toBeCloseToPixel(33);
+               expect(xScale.getPixelForValue(0, 1, 0, true)).toBeCloseToPixel(110);
 
-               expect(scale.getPixelForValue(0, 3, 0, false)).toBe(577);
-               expect(scale.getPixelForValue(0, 3, 0, true)).toBe(577);
+               expect(xScale.getPixelForValue(0, 3, 0, false)).toBeCloseToPixel(342);
+               expect(xScale.getPixelForValue(0, 3, 0, true)).toBeCloseToPixel(419);
        });
 
        it ('should get the correct pixel for a value when vertical', function() {
-               var scaleID = 'myScale';
-
-               var mockData = {
-                       datasets: [{
-                               yAxisID: scaleID,
-                               data: [10, 5, 0, 25, 78]
-                       }],
-                       labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick_last']
-               };
-
-               var mockContext = window.createMockContext();
-               var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category'));
-               config.gridLines.offsetGridLines = true;
-               config.position = 'left';
-               var Constructor = Chart.scaleService.getScaleConstructor('category');
-               var scale = new Constructor({
-                       ctx: mockContext,
-                       options: config,
-                       chart: {
-                               data: mockData
+               var chart = window.acquireChart({
+                       type: 'line',
+                       data: {
+                               datasets: [{
+                                       xAxisID: 'xScale0',
+                                       yAxisID: 'yScale0',
+                                       data: ['3', '5', '1', '4', '2']
+                               }],
+                               labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick5'],
+                               yLabels: ['1', '2', '3', '4', '5']
                        },
-                       id: scaleID
-               });
-
-               var minSize = scale.update(100, 200);
-
-               expect(scale.width).toBe(100);
-               expect(scale.height).toBe(200);
-               expect(scale.paddingTop).toBe(6);
-               expect(scale.paddingBottom).toBe(6);
-               expect(scale.paddingLeft).toBe(0);
-               expect(scale.paddingRight).toBe(0);
-               expect(scale.labelRotation).toBe(0);
-
-               expect(minSize).toEqual({
-                       width: 100,
-                       height: 200,
+                       options: {
+                               scales: {
+                                       xAxes: [{
+                                               id: 'xScale0',
+                                               type: 'category',
+                                               position: 'bottom',
+                                       }],
+                                       yAxes: [{
+                                               id: 'yScale0',
+                                               type: 'category',
+                                               position: 'left'
+                                       }]
+                               }
+                       }
                });
 
-               scale.left = 5;
-               scale.top = 5;
-               scale.right = 105;
-               scale.bottom = 205;
+               var yScale = chart.scales.yScale0;
+               expect(yScale.getPixelForValue(0, 0, 0, false)).toBe(32);
+               expect(yScale.getPixelForValue(0, 0, 0, true)).toBe(32);
+               expect(yScale.getValueForPixel(32)).toBe(0);
 
-               expect(scale.getPixelForValue(0, 0, 0, false)).toBe(11);
-               expect(scale.getPixelForValue(0, 0, 0, true)).toBe(30);
-               expect(scale.getValueForPixel(11)).toBe(0);
-               expect(scale.getValueForPixel(30)).toBe(0);
+               expect(yScale.getPixelForValue(0, 4, 0, false)).toBe(484);
+               expect(yScale.getPixelForValue(0, 4, 0, true)).toBe(484);
+               expect(yScale.getValueForPixel(484)).toBe(4);
 
-               expect(scale.getPixelForValue(0, 4, 0, false)).toBe(161);
-               expect(scale.getPixelForValue(0, 4, 0, true)).toBe(180);
-               expect(scale.getValueForPixel(162)).toBe(4);
+               yScale.options.gridLines.offsetGridLines = true;
 
-               config.gridLines.offsetGridLines = false;
+               expect(yScale.getPixelForValue(0, 0, 0, false)).toBe(32);
+               expect(yScale.getPixelForValue(0, 0, 0, true)).toBe(77);
+               expect(yScale.getValueForPixel(32)).toBe(0);
+               expect(yScale.getValueForPixel(77)).toBe(0);
 
-               expect(scale.getPixelForValue(0, 0, 0, false)).toBe(11);
-               expect(scale.getPixelForValue(0, 0, 0, true)).toBe(11);
-               expect(scale.getValueForPixel(11)).toBe(0);
-
-               expect(scale.getPixelForValue(0, 4, 0, false)).toBe(199);
-               expect(scale.getPixelForValue(0, 4, 0, true)).toBe(199);
-               expect(scale.getValueForPixel(199)).toBe(4);
+               expect(yScale.getPixelForValue(0, 4, 0, false)).toBe(394);
+               expect(yScale.getPixelForValue(0, 4, 0, true)).toBe(439);
+               expect(yScale.getValueForPixel(394)).toBe(4);
+               expect(yScale.getValueForPixel(439)).toBe(4);
        });
 
        it ('should get the correct pixel for a value when vertical and zoomed', function() {
-               var scaleID = 'myScale';
-
-               var mockData = {
-                       datasets: [{
-                               yAxisID: scaleID,
-                               data: [10, 5, 0, 25, 78]
-                       }],
-                       labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick_last']
-               };
-
-               var mockContext = window.createMockContext();
-               var config = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category'));
-               config.gridLines.offsetGridLines = true;
-               config.ticks.min = 'tick2';
-               config.ticks.max = 'tick4';
-               config.position = 'left';
-
-               var Constructor = Chart.scaleService.getScaleConstructor('category');
-               var scale = new Constructor({
-                       ctx: mockContext,
-                       options: config,
-                       chart: {
-                               data: mockData
+               var chart = window.acquireChart({
+                       type: 'line',
+                       data: {
+                               datasets: [{
+                                       xAxisID: 'xScale0',
+                                       yAxisID: 'yScale0',
+                                       data: ['3', '5', '1', '4', '2']
+                               }],
+                               labels: ['tick1', 'tick2', 'tick3', 'tick4', 'tick5'],
+                               yLabels: ['1', '2', '3', '4', '5']
                        },
-                       id: scaleID
-               });
-
-               var minSize = scale.update(100, 200);
-
-               expect(scale.width).toBe(70);
-               expect(scale.height).toBe(200);
-               expect(scale.paddingTop).toBe(6);
-               expect(scale.paddingBottom).toBe(6);
-               expect(scale.paddingLeft).toBe(0);
-               expect(scale.paddingRight).toBe(0);
-               expect(scale.labelRotation).toBe(0);
-
-               expect(minSize).toEqual({
-                       width: 70,
-                       height: 200,
+                       options: {
+                               scales: {
+                                       xAxes: [{
+                                               id: 'xScale0',
+                                               type: 'category',
+                                               position: 'bottom',
+                                       }],
+                                       yAxes: [{
+                                               id: 'yScale0',
+                                               type: 'category',
+                                               position: 'left',
+                                               ticks: {
+                                                       min: '2',
+                                                       max: '4'
+                                               }
+                                       }]
+                               }
+                       }
                });
 
-               scale.left = 5;
-               scale.top = 5;
-               scale.right = 75;
-               scale.bottom = 205;
+               var yScale = chart.scales.yScale0;
 
-               expect(scale.getPixelForValue(0, 1, 0, false)).toBe(11);
-               expect(scale.getPixelForValue(0, 1, 0, true)).toBe(42);
+               expect(yScale.getPixelForValue(0, 1, 0, false)).toBe(32);
+               expect(yScale.getPixelForValue(0, 1, 0, true)).toBe(32);
 
-               expect(scale.getPixelForValue(0, 3, 0, false)).toBe(136);
-               expect(scale.getPixelForValue(0, 3, 0, true)).toBe(168);
+               expect(yScale.getPixelForValue(0, 3, 0, false)).toBe(484);
+               expect(yScale.getPixelForValue(0, 3, 0, true)).toBe(484);
 
-               config.gridLines.offsetGridLines = false;
+               yScale.options.gridLines.offsetGridLines = true;
 
-               expect(scale.getPixelForValue(0, 1, 0, false)).toBe(11);
-               expect(scale.getPixelForValue(0, 1, 0, true)).toBe(11);
+               expect(yScale.getPixelForValue(0, 1, 0, false)).toBe(32);
+               expect(yScale.getPixelForValue(0, 1, 0, true)).toBe(107);
 
-               expect(scale.getPixelForValue(0, 3, 0, false)).toBe(199);
-               expect(scale.getPixelForValue(0, 3, 0, true)).toBe(199);
+               expect(yScale.getPixelForValue(0, 3, 0, false)).toBe(333);
+               expect(yScale.getPixelForValue(0, 3, 0, true)).toBe(409);
        });
 });