diff --git a/docs/timeline/index.html b/docs/timeline/index.html index f0b4d742..f8a71fc4 100644 --- a/docs/timeline/index.html +++ b/docs/timeline/index.html @@ -31,13 +31,13 @@ - + - + - + @@ -213,7 +213,7 @@ or a DataView (offering 1 way data binding). Items are regular objects and can contain the properties start, end (optional), content, - group (optional), className (optional), + group (optional), className (optional), editable (optional), and style (optional).

@@ -624,7 +624,7 @@ function (option, path) { If no order properties are provided, the order will be undetermined. - + groupOrderSwap Function @@ -787,7 +787,7 @@ function (option, path) { Only applicable when option selectable is true. - + multiselectPerGroup boolean @@ -805,7 +805,7 @@ function (option, path) { Callback function triggered when an item is about to be added: when the user double taps an empty space in the Timeline. See section Editing Items for more information. Only applicable when both options selectable and editable.add are set true. - + onAddGroup function @@ -829,7 +829,7 @@ function (option, path) { Callback function triggered when an item has been moved: after the user has dragged the item to an other position. See section Editing Items for more information. Only applicable when both options selectable and editable.updateTime or editable.updateGroup are set true. - + onMoveGroup function @@ -853,7 +853,7 @@ function (option, path) { Callback function triggered when an item is about to be removed: when the user tapped the delete button on the top right of a selected item. See section Editing Items for more information. Only applicable when both options selectable and editable.remove are set true. - + onRemoveGroup function @@ -967,13 +967,6 @@ function (option, path) { A template function used to generate the contents of the items. The function is called by the Timeline with an items data as argument, and must return HTML code as result. When the option template is specified, the items do not need to have a field content. See section Templates for a detailed explanation. - - throttleRedraw - number - 0 - Limit the maximum number of redraws to once every x milliseconds. For example setting throttleRedraw to `100` milliseconds will limit the number of redraws to 10 times per second. - - timeAxis Object diff --git a/index-timeline-graph2d.js b/index-timeline-graph2d.js index 50426671..da9e5173 100644 --- a/index-timeline-graph2d.js +++ b/index-timeline-graph2d.js @@ -44,4 +44,4 @@ exports.timeline = { // bundled external libraries exports.moment = require('./lib/module/moment'); exports.Hammer = require('./lib/module/hammer'); -exports.keycharm = require('keycharm'); \ No newline at end of file +exports.keycharm = require('keycharm'); diff --git a/lib/timeline/Core.js b/lib/timeline/Core.js index cd53472a..cca32f9c 100644 --- a/lib/timeline/Core.js +++ b/lib/timeline/Core.js @@ -222,8 +222,7 @@ Core.prototype.setOptions = function (options) { var fields = [ 'width', 'height', 'minHeight', 'maxHeight', 'autoResize', 'start', 'end', 'clickToUse', 'dataAttributes', 'hiddenDates', - 'locale', 'locales', 'moment', 'rtl', - 'throttleRedraw' + 'locale', 'locales', 'moment', 'rtl' ]; util.selectiveExtend(fields, this.options, options); @@ -233,7 +232,7 @@ Core.prototype.setOptions = function (options) { this.dom.leftContainer = this.dom.rightContainer; this.dom.rightContainer = contentContainer; this.dom.container.style.direction = "rtl"; - this.dom.backgroundVertical.className = 'vis-panel vis-background vis-vertical-rtl'; } + this.dom.backgroundVertical.className = 'vis-panel vis-background vis-vertical-rtl'; } this.options.orientation = {item:undefined,axis:undefined}; if ('orientation' in options) { @@ -330,7 +329,7 @@ Core.prototype.setOptions = function (options) { // override redraw with a throttled version if (!this._origRedraw) { this._origRedraw = this._redraw.bind(this); - this._redraw = util.throttle(this._origRedraw, this.options.throttleRedraw); + this._redraw = util.throttle(this._origRedraw); } else { // Not the initial run: redraw everything this._redraw(); diff --git a/lib/timeline/Timeline.js b/lib/timeline/Timeline.js index 6d4ef175..941b2dc5 100644 --- a/lib/timeline/Timeline.js +++ b/lib/timeline/Timeline.js @@ -47,7 +47,6 @@ function Timeline (container, items, groups, options) { end: null, autoResize: true, - throttleRedraw: 0, // ms orientation: { axis: 'bottom', // axis orientation: 'bottom', 'top', or 'both' @@ -426,7 +425,7 @@ Timeline.prototype.getItemRange = function () { var start = getStart(item); var end = getEnd(item); - + if (this.options.rtl) { var startSide = start - (item.getWidthRight() + 10) * factor; var endSide = end + (item.getWidthLeft() + 10) * factor; @@ -434,7 +433,7 @@ Timeline.prototype.getItemRange = function () { var startSide = start - (item.getWidthLeft() + 10) * factor; var endSide = end + (item.getWidthRight() + 10) * factor; } - + if (startSide < min) { min = startSide; diff --git a/lib/timeline/optionsGraph2d.js b/lib/timeline/optionsGraph2d.js index fb8e0455..30b27b75 100644 --- a/lib/timeline/optionsGraph2d.js +++ b/lib/timeline/optionsGraph2d.js @@ -100,7 +100,6 @@ let allOptions = { }, autoResize: {boolean}, - throttleRedraw: {number}, clickToUse: {boolean}, end: {number, date, string, moment}, format: { @@ -225,7 +224,6 @@ let configureOptions = { }, autoResize: true, - throttleRedraw: [10, 0, 1000, 10], clickToUse: false, end: '', format: { diff --git a/lib/timeline/optionsTimeline.js b/lib/timeline/optionsTimeline.js index 0069a3db..fc4330fe 100644 --- a/lib/timeline/optionsTimeline.js +++ b/lib/timeline/optionsTimeline.js @@ -27,7 +27,6 @@ let allOptions = { align: {string}, rtl: {boolean, 'undefined': 'undefined'}, autoResize: {boolean}, - throttleRedraw: {number}, clickToUse: {boolean}, dataAttributes: {string, array}, editable: { @@ -145,7 +144,6 @@ let configureOptions = { align: ['center', 'left', 'right'], direction: false, autoResize: true, - throttleRedraw: [10, 0, 1000, 10], clickToUse: false, // dataAttributes: ['all'], // FIXME: can be 'all' or string[] editable: { @@ -229,4 +227,4 @@ let configureOptions = { } }; -export {allOptions, configureOptions}; \ No newline at end of file +export {allOptions, configureOptions}; diff --git a/lib/util.js b/lib/util.js index ce41023c..15eba4cb 100644 --- a/lib/util.js +++ b/lib/util.js @@ -702,29 +702,20 @@ exports.updateProperty = function (object, key, value) { }; /** - * Throttle the given function to be only executed once every `wait` milliseconds + * Throttle the given function to be only executed once per animation frame * @param {function} fn - * @param {number} wait Time in milliseconds * @returns {function} Returns the throttled function */ -exports.throttle = function (fn, wait) { - var timeout = null; - var needExecution = false; +exports.throttle = function (fn) { + var scheduled = false; return function throttled () { - if (!timeout) { - needExecution = false; - fn(); - - timeout = setTimeout(function() { - timeout = null; - if (needExecution) { - throttled(); - } - }, wait) - } - else { - needExecution = true; + if (!scheduled) { + scheduled = true; + requestAnimationFrame(function () { + scheduled = false; + fn(); + }); } } };