Fixed #461: configuring either `start` or `end`

HISTORY.md

@@ -9,10 +9,11 @@ http://visjs.org
 - Implemented selection of a range of items using Shift+Click.
 - Fixed content in range items may overflow range after zoom.
 - Fixed onAdd/onUpdate callbacks when using a DataView (thanks @motzel).
+- Fixed configuring either `start` or `end`.
 
 ### Graph2D
 
-- Added alignZeros option to dataAxis with default value true.
+- Added `alignZeros` option to dataAxis with default value true.
 - Fixed bug with points drawn on bargraphs
 - Fixed docs
 

lib/timeline/Core.js

@@ -352,6 +352,23 @@ Core.prototype.clear = function(what) {
  *                                 for the animation. Default duration is 500 ms.
  */
 Core.prototype.fit = function(options) {
+  var range = this._getDataRange();
+
+  // skip range set if there is no start and end date
+  if (range.start === null && range.end === null) {
+    return;
+  }
+
+  var animate = (options && options.animate !== undefined) ? options.animate : true;
+  this.range.setRange(range.start, range.end, animate);
+};
+
+/**
+ * Calculate the data range of the items and applies a 5% window around it.
+ * @returns {{start: Date | null, end: Date | null}}
+ * @protected
+ */
+Core.prototype._getDataRange = function() {
   // apply the data range as range
   var dataRange = this.getItemRange();
 
@@ -368,13 +385,10 @@ Core.prototype.fit = function(options) {
     end = new Date(end.valueOf() + interval * 0.05);
   }
 
-  // skip range set if there is no start and end date
-  if (start === null && end === null) {
-    return;
+  return {
+    start: start,
+    end: end
   }
-
-  var animate = (options && options.animate !== undefined) ? options.animate : true;
-  this.range.setRange(start, end, animate);
 };
 
 /**

lib/timeline/Timeline.js

@@ -14,6 +14,7 @@ var ItemSet = require('./component/ItemSet');
  * Create a timeline visualization
  * @param {HTMLElement} container
  * @param {vis.DataSet | Array | google.visualization.DataTable} [items]
+ * @param {vis.DataSet | Array | google.visualization.DataTable} [groups]
  * @param {Object} [options]  See Timeline.setOptions for the available options.
  * @constructor
  * @extends Core
@@ -148,8 +149,14 @@ Timeline.prototype.setItems = function(items) {
 
   if (initialLoad) {
     if (this.options.start != undefined || this.options.end != undefined) {
-      var start = this.options.start != undefined ? this.options.start : null;
-      var end   = this.options.end != undefined   ? this.options.end : null;
+      if (this.options.start == undefined || this.options.end == undefined) {
+        var dataRange = this._getDataRange();
+      }
+
+      var start = this.options.start != undefined ? this.options.start : dataRange.start;
+      var end   = this.options.end != undefined   ? this.options.end   : dataRange.end;
+
+      console.log(this.options.start, this.options.end, dataRange)
 
       this.setWindow(start, end, {animate: false});
     }