archive-gh-me/Chart.js
1
0
Fork 0
mirror of https://github.com/chartjs/Chart.js.git synced 2025-12-08 20:36:08 +00:00
Code Issues Projects Releases Wiki Activity

Optimize animation frame requests (#2268)

Browse Source 
The animation service now keeps track of the active animation frame request and will skip new requests until the current one is executed. This can happen when processing mouse events, e.g. 'mousemove' and 'mouseout' events will trigger multiple renders.
This commit is contained in:
Simon Brunel 2016-04-16 02:15:54 +02:00 committed by Tanner Linsley
parent fc74f98dd6
commit 5836c19ec5
1 changed files with 14 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/core/core.animation.js
View File

@ -26,6 +26,7 @@ module.exports = function(Chart) {
frameDuration: 17,
animations: [],
dropFrames: 0,
request: null,
addAnimation: function(chartInstance, animationObject, duration, lazy) {
if (!lazy) {
@ -47,7 +48,7 @@ module.exports = function(Chart) {
// If there are no animations queued, manually kickstart a digest, for lack of a better word
if (this.animations.length === 1) {
helpers.requestAnimFrame.call(window, this.digestWrapper);
this.requestAnimationFrame();
}
},
// Cancel the animation for a given chart instance
@ -61,9 +62,17 @@ module.exports = function(Chart) {
chartInstance.animating = false;
}
},
// calls startDigest with the proper context
digestWrapper: function() {
Chart.animationService.startDigest.call(Chart.animationService);
requestAnimationFrame: function() {
var me = this;
if (me.request === null) {
// Skip animation frame requests until the active one is executed.
// This can happen when processing mouse events, e.g. 'mousemove'
// and 'mouseout' events will trigger multiple renders.
me.request = helpers.requestAnimFrame.call(window, function() {
me.request = null;
me.startDigest();
});
}
},
startDigest: function() {
@ -113,7 +122,7 @@ module.exports = function(Chart) {
// Do we have more stuff to animate?
if (this.animations.length > 0) {
helpers.requestAnimFrame.call(window, this.digestWrapper);
this.requestAnimationFrame();
}
}
};