From d0b67c603b456698dbcbf75b211f580f9d10843e Mon Sep 17 00:00:00 2001 From: Evert Timberg Date: Sun, 24 Jan 2016 10:58:30 -0500 Subject: [PATCH] Line and bar test updates --- src/controllers/controller.line.js | 2 - test/controller.bar.tests.js | 146 +++++++++++ test/controller.line.tests.js | 375 +++++++++++++++++++++++++++++ 3 files changed, 521 insertions(+), 2 deletions(-) diff --git a/src/controllers/controller.line.js b/src/controllers/controller.line.js index 4d2df3bb6..bef0cde44 100644 --- a/src/controllers/controller.line.js +++ b/src/controllers/controller.line.js @@ -223,8 +223,6 @@ } else { return yScale.getPixelForValue(sumPos + value); } - - return yScale.getPixelForValue(value); } return yScale.getPixelForValue(value); diff --git a/test/controller.bar.tests.js b/test/controller.bar.tests.js index 76634e941..64b4eb927 100644 --- a/test/controller.bar.tests.js +++ b/test/controller.bar.tests.js @@ -378,6 +378,152 @@ describe('Bar controller tests', function() { expect(bar2._model.y).toBe(37); }); + it('should update elements when the scales are stacked', function() { + var data = { + datasets: [{ + data: [10, -10, 10, -10], + label: 'dataset1', + xAxisID: 'firstXScaleID', + yAxisID: 'firstYScaleID', + bar: true + }, { + data: [10, 15, 0, -4], + label: 'dataset2', + xAxisID: 'firstXScaleID', + yAxisID: 'firstYScaleID', + bar: true + }], + labels: ['label1', 'label2', 'label3', 'label4'] + }; + var mockContext = window.createMockContext(); + + var VerticalScaleConstructor = Chart.scaleService.getScaleConstructor('linear'); + var verticalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear')); + verticalScaleConfig = Chart.helpers.scaleMerge(verticalScaleConfig, Chart.defaults.bar.scales.yAxes[0]); + verticalScaleConfig.stacked = true; + var yScale = new VerticalScaleConstructor({ + ctx: mockContext, + options: verticalScaleConfig, + chart: { + data: data + }, + id: 'firstYScaleID' + }); + + // Update ticks & set physical dimensions + var verticalSize = yScale.update(50, 200); + yScale.top = 0; + yScale.left = 0; + yScale.right = verticalSize.width; + yScale.bottom = verticalSize.height; + + var HorizontalScaleConstructor = Chart.scaleService.getScaleConstructor('category'); + var horizontalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category')); + horizontalScaleConfig = Chart.helpers.scaleMerge(horizontalScaleConfig, Chart.defaults.bar.scales.xAxes[0]); + horizontalScaleConfig.stacked = true; + var xScale = new HorizontalScaleConstructor({ + ctx: mockContext, + options: horizontalScaleConfig, + chart: { + data: data + }, + id: 'firstXScaleID' + }); + + // Update ticks & set physical dimensions + var horizontalSize = xScale.update(200, 50); + xScale.left = yScale.right; + xScale.top = yScale.bottom; + xScale.right = horizontalSize.width + xScale.left; + xScale.bottom = horizontalSize.height + xScale.top; + + var chart = { + data: data, + config: { + type: 'bar' + }, + options: { + elements: { + rectangle: { + backgroundColor: 'rgb(255, 0, 0)', + borderColor: 'rgb(0, 0, 255)', + borderWidth: 2, + } + }, + scales: { + xAxes: [{ + id: 'firstXScaleID' + }], + yAxes: [{ + id: 'firstYScaleID' + }] + } + }, + scales: { + firstXScaleID: xScale, + firstYScaleID: yScale, + } + }; + + var controller0 = new Chart.controllers.bar(chart, 0); + var controller1 = new Chart.controllers.bar(chart, 1); + + controller0.buildOrUpdateElements(); + controller0.update(); + controller1.buildOrUpdateElements(); + controller1.update(); + + expect(chart.data.datasets[0].metaData[0]._model).toEqual(jasmine.objectContaining({ + x: 106, + y: 60, + base: 113, + width: 30.400000000000002 + })); + expect(chart.data.datasets[0].metaData[1]._model).toEqual(jasmine.objectContaining({ + x: 144, + y: 167, + base: 113, + width: 30.400000000000002 + })); + expect(chart.data.datasets[0].metaData[2]._model).toEqual(jasmine.objectContaining({ + x: 183, + y: 60, + base: 113, + width: 30.400000000000002 + })); + expect(chart.data.datasets[0].metaData[3]._model).toEqual(jasmine.objectContaining({ + x: 222, + y: 167, + base: 113, + width: 30.400000000000002 + })); + + expect(chart.data.datasets[1].metaData[0]._model).toEqual(jasmine.objectContaining({ + x: 106, + y: 6, + base: 60, + width: 30.400000000000002 + })); + expect(chart.data.datasets[1].metaData[1]._model).toEqual(jasmine.objectContaining({ + x: 144, + y: 33, + base: 113, + width: 30.400000000000002 + })); + expect(chart.data.datasets[1].metaData[2]._model).toEqual(jasmine.objectContaining({ + x: 183, + y: 60, + base: 60, + width: 30.400000000000002 + })); + expect(chart.data.datasets[1].metaData[3]._model).toEqual(jasmine.objectContaining({ + x: 222, + y: 189, + base: 167, + width: 30.400000000000002 + })); + }); + it ('should draw all bars', function() { var data = { datasets: [{}, { diff --git a/test/controller.line.tests.js b/test/controller.line.tests.js index 3cf921c14..40c7c2bb0 100644 --- a/test/controller.line.tests.js +++ b/test/controller.line.tests.js @@ -544,6 +544,381 @@ describe('Line controller tests', function() { }); }); + it('should update elements when the y scale is stacked', function() { + var data = { + datasets: [{ + data: [10, 15, -4, -4], + label: 'dataset2', + xAxisID: 'firstXScaleID', + yAxisID: 'firstYScaleID', + type: 'line' + }, { + data: [20, 20, 30, -30], + label: 'dataset1', + xAxisID: 'firstXScaleID', + yAxisID: 'firstYScaleID', + type: 'line' + }], + labels: ['label1', 'label2', 'label3', 'label4'] + }; + var mockContext = window.createMockContext(); + + var VerticalScaleConstructor = Chart.scaleService.getScaleConstructor('linear'); + var verticalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear')); + verticalScaleConfig = Chart.helpers.scaleMerge(verticalScaleConfig, Chart.defaults.line.scales.yAxes[0]); + verticalScaleConfig.stacked = true; + var yScale = new VerticalScaleConstructor({ + ctx: mockContext, + options: verticalScaleConfig, + chart: { + data: data + }, + id: 'firstYScaleID' + }); + + // Update ticks & set physical dimensions + var verticalSize = yScale.update(50, 200); + yScale.top = 0; + yScale.left = 0; + yScale.right = verticalSize.width; + yScale.bottom = verticalSize.height; + + var HorizontalScaleConstructor = Chart.scaleService.getScaleConstructor('category'); + var horizontalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category')); + horizontalScaleConfig = Chart.helpers.scaleMerge(horizontalScaleConfig, Chart.defaults.line.scales.xAxes[0]); + var xScale = new HorizontalScaleConstructor({ + ctx: mockContext, + options: horizontalScaleConfig, + chart: { + data: data + }, + id: 'firstXScaleID' + }); + + // Update ticks & set physical dimensions + var horizontalSize = xScale.update(200, 50); + xScale.left = yScale.right; + xScale.top = yScale.bottom; + xScale.right = horizontalSize.width + xScale.left; + xScale.bottom = horizontalSize.height + xScale.top; + + + var chart = { + chartArea: { + bottom: 200, + left: xScale.left, + right: xScale.left + 200, + top: 0 + }, + data: data, + config: { + type: 'line' + }, + options: { + showLines: true, + elements: { + line: { + backgroundColor: 'rgb(255, 0, 0)', + borderCapStyle: 'round', + borderColor: 'rgb(0, 255, 0)', + borderDash: [], + borderDashOffset: 0.1, + borderJoinStyle: 'bevel', + borderWidth: 1.2, + fill: true, + tension: 0, + }, + point: { + backgroundColor: Chart.defaults.global.defaultColor, + borderWidth: 1, + borderColor: Chart.defaults.global.defaultColor, + hitRadius: 1, + hoverRadius: 4, + hoverBorderWidth: 1, + radius: 3, + pointStyle: 'circle' + } + }, + scales: { + xAxes: [{ + id: 'firstXScaleID' + }], + yAxes: [{ + id: 'firstYScaleID' + }] + } + }, + scales: { + firstXScaleID: xScale, + firstYScaleID: yScale, + } + }; + + var controller = new Chart.controllers.line(chart, 0); + controller.update(); + + // Line element + expect(chart.data.datasets[0].metaDataset._model).toEqual(jasmine.objectContaining({ + scaleTop: 0, + scaleBottom: 200, + scaleZero: 100, + })); + + expect(chart.data.datasets[0].metaData[0]._model).toEqual(jasmine.objectContaining({ + // Point + x: 91, + y: 30, + })); + + expect(chart.data.datasets[0].metaData[1]._model).toEqual(jasmine.objectContaining({ + // Point + x: 141, + y: 18, + })); + + expect(chart.data.datasets[0].metaData[2]._model).toEqual(jasmine.objectContaining({ + // Point + x: 192, + y: 109, + })); + + expect(chart.data.datasets[0].metaData[3]._model).toEqual(jasmine.objectContaining({ + // Point + x: 242, + y: 180, + })); + }); + + it('should find the correct scale zero when the data is all positive', function() { + var data = { + datasets: [{ + data: [10, 15, 20, 20], + label: 'dataset2', + xAxisID: 'firstXScaleID', + yAxisID: 'firstYScaleID', + type: 'line' + }], + labels: ['label1', 'label2', 'label3', 'label4'] + }; + var mockContext = window.createMockContext(); + + var VerticalScaleConstructor = Chart.scaleService.getScaleConstructor('linear'); + var verticalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear')); + verticalScaleConfig = Chart.helpers.scaleMerge(verticalScaleConfig, Chart.defaults.line.scales.yAxes[0]); + verticalScaleConfig.stacked = true; + var yScale = new VerticalScaleConstructor({ + ctx: mockContext, + options: verticalScaleConfig, + chart: { + data: data + }, + id: 'firstYScaleID' + }); + + // Update ticks & set physical dimensions + var verticalSize = yScale.update(50, 200); + yScale.top = 0; + yScale.left = 0; + yScale.right = verticalSize.width; + yScale.bottom = verticalSize.height; + + var HorizontalScaleConstructor = Chart.scaleService.getScaleConstructor('category'); + var horizontalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category')); + horizontalScaleConfig = Chart.helpers.scaleMerge(horizontalScaleConfig, Chart.defaults.line.scales.xAxes[0]); + var xScale = new HorizontalScaleConstructor({ + ctx: mockContext, + options: horizontalScaleConfig, + chart: { + data: data + }, + id: 'firstXScaleID' + }); + + // Update ticks & set physical dimensions + var horizontalSize = xScale.update(200, 50); + xScale.left = yScale.right; + xScale.top = yScale.bottom; + xScale.right = horizontalSize.width + xScale.left; + xScale.bottom = horizontalSize.height + xScale.top; + + + var chart = { + chartArea: { + bottom: 200, + left: xScale.left, + right: xScale.left + 200, + top: 0 + }, + data: data, + config: { + type: 'line' + }, + options: { + showLines: true, + elements: { + line: { + backgroundColor: 'rgb(255, 0, 0)', + borderCapStyle: 'round', + borderColor: 'rgb(0, 255, 0)', + borderDash: [], + borderDashOffset: 0.1, + borderJoinStyle: 'bevel', + borderWidth: 1.2, + fill: true, + tension: 0, + }, + point: { + backgroundColor: Chart.defaults.global.defaultColor, + borderWidth: 1, + borderColor: Chart.defaults.global.defaultColor, + hitRadius: 1, + hoverRadius: 4, + hoverBorderWidth: 1, + radius: 3, + pointStyle: 'circle' + } + }, + scales: { + xAxes: [{ + id: 'firstXScaleID' + }], + yAxes: [{ + id: 'firstYScaleID' + }] + } + }, + scales: { + firstXScaleID: xScale, + firstYScaleID: yScale, + } + }; + + var controller = new Chart.controllers.line(chart, 0); + controller.update(); + + // Line element + expect(chart.data.datasets[0].metaDataset._model).toEqual(jasmine.objectContaining({ + scaleTop: 0, + scaleBottom: 200, + scaleZero: 194, // yScale.min is the 0 point + })); + }); + + it('should find the correct scale zero when the data is all negative', function() { + var data = { + datasets: [{ + data: [-10, -15, -20, -20], + label: 'dataset2', + xAxisID: 'firstXScaleID', + yAxisID: 'firstYScaleID', + type: 'line' + }], + labels: ['label1', 'label2', 'label3', 'label4'] + }; + var mockContext = window.createMockContext(); + + var VerticalScaleConstructor = Chart.scaleService.getScaleConstructor('linear'); + var verticalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('linear')); + verticalScaleConfig = Chart.helpers.scaleMerge(verticalScaleConfig, Chart.defaults.line.scales.yAxes[0]); + verticalScaleConfig.stacked = true; + var yScale = new VerticalScaleConstructor({ + ctx: mockContext, + options: verticalScaleConfig, + chart: { + data: data + }, + id: 'firstYScaleID' + }); + + // Update ticks & set physical dimensions + var verticalSize = yScale.update(50, 200); + yScale.top = 0; + yScale.left = 0; + yScale.right = verticalSize.width; + yScale.bottom = verticalSize.height; + + var HorizontalScaleConstructor = Chart.scaleService.getScaleConstructor('category'); + var horizontalScaleConfig = Chart.helpers.clone(Chart.scaleService.getScaleDefaults('category')); + horizontalScaleConfig = Chart.helpers.scaleMerge(horizontalScaleConfig, Chart.defaults.line.scales.xAxes[0]); + var xScale = new HorizontalScaleConstructor({ + ctx: mockContext, + options: horizontalScaleConfig, + chart: { + data: data + }, + id: 'firstXScaleID' + }); + + // Update ticks & set physical dimensions + var horizontalSize = xScale.update(200, 50); + xScale.left = yScale.right; + xScale.top = yScale.bottom; + xScale.right = horizontalSize.width + xScale.left; + xScale.bottom = horizontalSize.height + xScale.top; + + + var chart = { + chartArea: { + bottom: 200, + left: xScale.left, + right: xScale.left + 200, + top: 0 + }, + data: data, + config: { + type: 'line' + }, + options: { + showLines: true, + elements: { + line: { + backgroundColor: 'rgb(255, 0, 0)', + borderCapStyle: 'round', + borderColor: 'rgb(0, 255, 0)', + borderDash: [], + borderDashOffset: 0.1, + borderJoinStyle: 'bevel', + borderWidth: 1.2, + fill: true, + tension: 0, + }, + point: { + backgroundColor: Chart.defaults.global.defaultColor, + borderWidth: 1, + borderColor: Chart.defaults.global.defaultColor, + hitRadius: 1, + hoverRadius: 4, + hoverBorderWidth: 1, + radius: 3, + pointStyle: 'circle' + } + }, + scales: { + xAxes: [{ + id: 'firstXScaleID' + }], + yAxes: [{ + id: 'firstYScaleID' + }] + } + }, + scales: { + firstXScaleID: xScale, + firstYScaleID: yScale, + } + }; + + var controller = new Chart.controllers.line(chart, 0); + controller.update(); + + // Line element + expect(chart.data.datasets[0].metaDataset._model).toEqual(jasmine.objectContaining({ + scaleTop: 0, + scaleBottom: 200, + scaleZero: 6, // yScale.max is the zero point + })); + }); + it ('should fall back to the line styles for points', function() { var data = { datasets: [{ -- 2.47.3