diff --git a/lib/timeline/component/Group.js b/lib/timeline/component/Group.js index c11d7cce..5dcc2e49 100644 --- a/lib/timeline/component/Group.js +++ b/lib/timeline/component/Group.js @@ -14,6 +14,7 @@ function Group (groupId, data, itemSet) { this.subgroupIndex = 0; this.subgroupOrderer = data && data.subgroupOrder; this.itemSet = itemSet; + this.isVisible = null; this.dom = {}; this.props = { @@ -180,6 +181,8 @@ Group.prototype.redraw = function(range, margin, restack) { // recalculate the height of the subgroups this._calculateSubGroupHeights(); + this.isVisible = this._isGroupVisible(range); + // reposition visible items vertically if (typeof this.itemSet.options.order === 'function') { // a custom order function @@ -219,6 +222,10 @@ Group.prototype.redraw = function(range, margin, restack) { } } + if (!this.isVisible && this.height) { + return resized = false; + } + // recalculate the height of the group var height = this._calculateHeight(margin); @@ -265,6 +272,17 @@ Group.prototype._calculateSubGroupHeights = function () { } }; +/** + * check if group is visible + * @private + */ +Group.prototype._isGroupVisible = function (range) { + var isVisible = + (this.top < range.body.domProps.centerContainer.height - range.body.domProps.scrollTop) && + (this.top + this.height > - range.body.domProps.scrollTop); + return isVisible; +} + /** * recalculate the height of the group * @param {{item: {horizontal: number, vertical: number}, axis: number}} margin @@ -475,6 +493,15 @@ Group.prototype.order = function() { Group.prototype._updateVisibleItems = function(orderedItems, oldVisibleItems, range) { var visibleItems = []; var visibleItemsLookup = {}; // we keep this to quickly look up if an item already exists in the list without using indexOf on visibleItems + + if (!this.isVisible) { + for (i = 0; i < oldVisibleItems.length; i++) { + item = oldVisibleItems[i]; + if (item.displayed) item.hide(); + } + return visibleItems; + } + var interval = (range.end - range.start) / 4; var lowerBound = range.start - interval; var upperBound = range.end + interval; diff --git a/lib/timeline/component/item/RangeItem.js b/lib/timeline/component/item/RangeItem.js index 694d21b6..bfd6f7ee 100644 --- a/lib/timeline/component/item/RangeItem.js +++ b/lib/timeline/component/item/RangeItem.js @@ -43,8 +43,14 @@ RangeItem.prototype.baseClassName = 'vis-item vis-range'; */ RangeItem.prototype.isVisible = function(range) { // determine visibility - return (this.data.start < range.end) && (this.data.end > range.start); -}; +var isVisible = +// determine horizontal visibillity + (this.data.start < range.end) && + (this.data.end > range.start) && +// determine verticaltal visibillity + (this.parent.top < range.body.domProps.centerContainer.height - range.body.domProps.scrollTop) && + (this.parent.top + this.parent.height > - range.body.domProps.scrollTop) +return isVisible;}; /** * Repaint the item