From d88ff038947ee264c08c3aee061d90ac4c574fc5 Mon Sep 17 00:00:00 2001 From: dpuyosa Date: Fri, 25 Aug 2017 23:27:34 +0100 Subject: [PATCH] Support limiting frame rate By @dpuyosa via #83 --- builder/index.html | 12 +++++++++++- package.json | 2 +- smoothie.d.ts | 5 ++++- smoothie.js | 12 ++++++++++-- 4 files changed, 26 insertions(+), 5 deletions(-) diff --git a/builder/index.html b/builder/index.html index 943245c..822688a 100644 --- a/builder/index.html +++ b/builder/index.html @@ -402,7 +402,17 @@ bindRange({target: chart, name: 'Delay', propertyName: 'delay', min: 0, max: 2000}); bindCheckBox({target: chart.options, name: 'Scroll Backwards', propertyName: 'scrollBackwards'}); bindCheckBox({target: chart.options, name: 'Show Tooltip', propertyName: 'tooltip'}); - + bindCheckBox({ + target: chart.options, + name: 'Limit FPS', + propertyName: 'limitFPS', + convert: function (checked) { + return checked ? 15 : 0; + }, + convertBack: function (value) { + return value !== 0; + } + }); // Series startControlSection('Series'); bindColor({target: chart.seriesSet[0].options, name: 'Series line color', propertyName: 'strokeStyle', optional: true, enabled: true, opacity: 1, emptyValue: 'none'}); diff --git a/package.json b/package.json index 62d9a3a..1d464be 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "smoothie", - "version": "1.31.0", + "version": "1.32.0", "description": "Smoothie Charts: smooooooth JavaScript charts for realtime streaming data", "main": "./smoothie.js", "types": "./smoothie.d.ts", diff --git a/smoothie.d.ts b/smoothie.d.ts index 4c7efba..cb18196 100644 --- a/smoothie.d.ts +++ b/smoothie.d.ts @@ -1,4 +1,4 @@ -// Type definitions for Smoothie Charts 1.29 +// Type definitions for Smoothie Charts 1.32 // Project: https://github.com/joewalnes/smoothie // Definitions by: Drew Noakes // Mike H. Hawley @@ -135,6 +135,9 @@ export interface IChartOptions { /** Allows the chart to stretch according to its containers and layout settings. Default is false, for backwards compatibility. */ responsive?: boolean; + + /** The maximum frame rate the chart will render at, in FPS. Default is 0, meaning no limit. */ + limitFPS?: number; } /** diff --git a/smoothie.js b/smoothie.js index bf097b9..543db38 100644 --- a/smoothie.js +++ b/smoothie.js @@ -78,6 +78,7 @@ * v1.29.1: Include types in package, and make property optional, by @TrentHouliston * v1.30: Fix inverted logic in devicePixelRatio support, by @scanlime * v1.31: Support tooltips, by @Sly1024 and @drewnoakes + * v1.32: Support frame rate limit, by @dpuyosa */ ;(function(exports) { @@ -283,7 +284,9 @@ * lineWidth: 1, * strokeStyle: '#BBBBBB' * }, - * tooltipFormatter: SmoothieChart.tooltipFormatter // formatter function for tooltip text + * tooltipFormatter: SmoothieChart.tooltipFormatter, // formatter function for tooltip text + * responsive: false, // whether the chart should adapt to the size of the canvas + * limitFPS: 0 // maximum frame rate the chart will render at, in FPS (zero means no limit) * } * * @@ -351,7 +354,8 @@ strokeStyle: '#BBBBBB' }, tooltipFormatter: SmoothieChart.tooltipFormatter, - responsive: false + responsive: false, + limitFPS: 0 }; // Based on http://inspirit.github.com/jsfeat/js/compatibility.js @@ -681,6 +685,10 @@ SmoothieChart.prototype.render = function(canvas, time) { var nowMillis = new Date().getTime(); + // Respect any frame rate limit. + if (this.options.limitFPS > 0 && nowMillis - this.lastRenderTimeMillis < (1000/this.options.limitFPS)) + return; + if (!this.isAnimatingScale) { // We're not animating. We can use the last render time and the scroll speed to work out whether // we actually need to paint anything yet. If not, we can return immediately.