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 @@
Configuration Options
If no order properties are provided, the order will be undetermined.
-
+
groupOrderSwap
Function
@@ -787,7 +787,7 @@
Configuration Options
Only applicable when option selectable is true.
-
+
multiselectPerGroup
boolean
@@ -805,7 +805,7 @@
Configuration Options
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 @@
Configuration Options
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 @@
Configuration Options
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
@@ -973,13 +973,6 @@
Configuration Options
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 50426671b..da9e5173f 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 cd53472ad..cca32f9ca 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 4b7cde2a7..a8e55e92e 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 fb8e04557..30b27b75d 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 0069a3dbb..fc4330fef 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 6e90ffc20..c1dc1c213 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();
+ });
}
}
};