Performance improvements (#6729)

diff --git a/src/elements/element.line.js b/src/elements/element.line.js
index c8873aea3d908ddae77192b68393a27bfabe4be6..f06290672bf4774a1cc6bde2ef7298cbd58ab014 100644 (file)
--- a/src/elements/element.line.js
+++ b/src/elements/element.line.js
@@ -36,7 +36,7 @@ class Line extends Element {
                var vm = me._view;
                var ctx = me._ctx;
                var spanGaps = vm.spanGaps;
-               var points = me._children.slice(); // clone array
+               var points = me._children;
                var globalDefaults = defaults.global;
                var globalOptionLineElements = globalDefaults.elements.line;
                var lastDrawnIndex = -1;
@@ -48,6 +48,7 @@ class Line extends Element {
                }
 
                if (me._loop) {
+                       points = points.slice(); // clone array
                        for (index = 0; index < points.length; ++index) {
                                previous = helpers.previousItem(points, index);
                                // If the line has an open path, shift the point array

diff --git a/src/elements/element.point.js b/src/elements/element.point.js
index 14849f9ae3963289742636ec0298c97cb107482c..ed8eef64b83a44a73cd7b1111c999ca593b03956 100644 (file)
--- a/src/elements/element.point.js
+++ b/src/elements/element.point.js
@@ -4,8 +4,6 @@ const defaults = require('../core/core.defaults');
 const Element = require('../core/core.element');
 const helpers = require('../helpers/index');
 
-const valueOrDefault = helpers.valueOrDefault;
-
 const defaultColor = defaults.global.defaultColor;
 
 defaults._set('global', {
@@ -31,22 +29,22 @@ class Point extends Element {
        }
 
        inRange(mouseX, mouseY) {
-               var vm = this._view;
+               const vm = this._view;
                return vm ? ((Math.pow(mouseX - vm.x, 2) + Math.pow(mouseY - vm.y, 2)) < Math.pow(vm.hitRadius + vm.radius, 2)) : false;
        }
 
        inXRange(mouseX) {
-               var vm = this._view;
+               const vm = this._view;
                return vm ? (Math.abs(mouseX - vm.x) < vm.radius + vm.hitRadius) : false;
        }
 
        inYRange(mouseY) {
-               var vm = this._view;
+               const vm = this._view;
                return vm ? (Math.abs(mouseY - vm.y) < vm.radius + vm.hitRadius) : false;
        }
 
        getCenterPoint() {
-               var vm = this._view;
+               const vm = this._view;
                return {
                        x: vm.x,
                        y: vm.y
@@ -54,14 +52,14 @@ class Point extends Element {
        }
 
        size() {
-               var vm = this._view;
-               var radius = vm.radius || 0;
-               var borderWidth = vm.borderWidth || 0;
+               const vm = this._view;
+               const radius = vm.radius || 0;
+               const borderWidth = vm.borderWidth || 0;
                return (radius + borderWidth) * 2;
        }
 
        tooltipPosition() {
-               var vm = this._view;
+               const vm = this._view;
                return {
                        x: vm.x,
                        y: vm.y,
@@ -70,25 +68,23 @@ class Point extends Element {
        }
 
        draw(chartArea) {
-               var vm = this._view;
-               var ctx = this._ctx;
-               var pointStyle = vm.pointStyle;
-               var rotation = vm.rotation;
-               var radius = vm.radius;
-               var x = vm.x;
-               var y = vm.y;
-               var globalDefaults = defaults.global;
-               var defaultColor = globalDefaults.defaultColor; // eslint-disable-line no-shadow
-
-               if (vm.skip) {
+               const vm = this._view;
+               const ctx = this._ctx;
+               const pointStyle = vm.pointStyle;
+               const rotation = vm.rotation;
+               const radius = vm.radius;
+               const x = vm.x;
+               const y = vm.y;
+
+               if (vm.skip || radius <= 0) {
                        return;
                }
 
                // Clipping for Points.
                if (chartArea === undefined || helpers.canvas._isPointInArea(vm, chartArea)) {
-                       ctx.strokeStyle = vm.borderColor || defaultColor;
-                       ctx.lineWidth = valueOrDefault(vm.borderWidth, globalDefaults.elements.point.borderWidth);
-                       ctx.fillStyle = vm.backgroundColor || defaultColor;
+                       ctx.strokeStyle = vm.borderColor;
+                       ctx.lineWidth = vm.borderWidth;
+                       ctx.fillStyle = vm.backgroundColor;
                        helpers.canvas.drawPoint(ctx, pointStyle, radius, x, y, rotation);
                }
        }

diff --git a/test/specs/element.point.tests.js b/test/specs/element.point.tests.js
index bc51bedefaf64b5a47cf987aca5129809b65106a..b3ea7631df9ddfbf5ac4e895b969dff17b2bc4d4 100644 (file)
--- a/test/specs/element.point.tests.js
+++ b/test/specs/element.point.tests.js
@@ -72,52 +72,6 @@ describe('Chart.elements.Point', function() {
                expect(point.getCenterPoint()).toEqual({x: 10, y: 10});
        });
 
-       it ('should draw correctly with default settings if necessary', function() {
-               var mockContext = window.createMockContext();
-               var point = new Chart.elements.Point({
-                       _datasetIndex: 2,
-                       _index: 1,
-                       _ctx: mockContext
-               });
-
-               // Attach a view object as if we were the controller
-               point._view = {
-                       radius: 2,
-                       hitRadius: 3,
-                       x: 10,
-                       y: 15,
-                       ctx: mockContext
-               };
-
-               point.draw();
-
-               expect(mockContext.getCalls()).toEqual([{
-                       name: 'setStrokeStyle',
-                       args: ['rgba(0,0,0,0.1)']
-               }, {
-                       name: 'setLineWidth',
-                       args: [1]
-               }, {
-                       name: 'setFillStyle',
-                       args: ['rgba(0,0,0,0.1)']
-               }, {
-                       name: 'beginPath',
-                       args: []
-               }, {
-                       name: 'arc',
-                       args: [10, 15, 2, 0, 2 * Math.PI]
-               }, {
-                       name: 'closePath',
-                       args: [],
-               }, {
-                       name: 'fill',
-                       args: [],
-               }, {
-                       name: 'stroke',
-                       args: []
-               }]);
-       });
-
        it ('should not draw if skipped', function() {
                var mockContext = window.createMockContext();
                var point = new Chart.elements.Point({