Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Performance improvements #6729

Merged
merged 2 commits into from
Nov 11, 2019
Merged

Performance improvements #6729

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5551580
Performance improvements
kurkle Nov 11, 2019
8515156
Revert interaction optimization
kurkle Nov 11, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion src/elements/element.line.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand All @@ -48,6 +48,7 @@ class Line extends Element {
}

if (me._loop) {
points = points.slice(); // clone array
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

great catch! I had noticed this clone taking awhile, but didn't see that we could move it to occur here

for (index = 0; index < points.length; ++index) {
previous = helpers.previousItem(points, index);
// If the line has an open path, shift the point array
Expand Down
44 changes: 20 additions & 24 deletions src/elements/element.point.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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', {
Expand All @@ -31,37 +29,37 @@ 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
};
}

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,
Expand All @@ -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);
}
}
Expand Down
46 changes: 0 additions & 46 deletions test/specs/element.point.tests.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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({
Expand Down