Merge pull request #2385 from ahocevar/update-vectors-while-animating

Option to update vector layers while animating

externs/olx.js

@@ -3220,6 +3220,7 @@ olx.layer.TileOptions.prototype.useInterimTilesOnError;
  *     saturation: (number|undefined),
  *     source: (ol.source.Vector|undefined),
  *     style: (ol.style.Style|Array.<ol.style.Style>|ol.style.StyleFunction|undefined),
+ *     updateWhileAnimating: (boolean|undefined),
  *     visible: (boolean|undefined)}}
  * @api
  */
@@ -3328,6 +3329,17 @@ olx.layer.VectorOptions.prototype.source;
 olx.layer.VectorOptions.prototype.style;
 
 
+/**
+ * When set to `true`, feature batches will be recreated during animations.
+ * This means that no vectors will be shown clipped, but the setting will have a
+ * performance impact for large amounts of vector data. When set to `false`,
+ * batches will be recreated when no animation is active.  Default is `false`.
+ * @type {boolean|undefined}
+ * @api
+ */
+olx.layer.VectorOptions.prototype.updateWhileAnimating;
+
+
 /**
  * Visibility. Default is `true` (visible).
  * @type {boolean|undefined}

src/ol/layer/vectorlayer.js

@@ -36,6 +36,7 @@ ol.layer.Vector = function(opt_options) {
 
   delete baseOptions.style;
   delete baseOptions.renderBuffer;
+  delete baseOptions.updateWhileAnimating;
   goog.base(this, /** @type {olx.layer.LayerOptions} */ (baseOptions));
 
   /**
@@ -61,6 +62,13 @@ ol.layer.Vector = function(opt_options) {
 
   this.setStyle(options.style);
 
+  /**
+   * @type {boolean}
+   * @private
+   */
+  this.updateWhileAnimating_ = goog.isDef(options.updateWhileAnimating) ?
+      options.updateWhileAnimating : false;
+
 };
 goog.inherits(ol.layer.Vector, ol.layer.Layer);
 
@@ -113,6 +121,15 @@ ol.layer.Vector.prototype.getStyleFunction = function() {
 };
 
 
+/**
+ * @return {boolean} Whether the rendered layer should be updated while
+ *     animating.
+ */
+ol.layer.Vector.prototype.getUpdateWhileAnimating = function() {
+  return this.updateWhileAnimating_;
+};
+
+
 /**
  * @param {function(ol.Feature, ol.Feature):number|null|undefined} renderOrder
  *     Render order.

src/ol/renderer/canvas/canvasvectorlayerrenderer.js

@@ -169,7 +169,8 @@ ol.renderer.canvas.VectorLayer.prototype.prepareFrame =
       frameState.attributions, vectorSource.getAttributions());
   this.updateLogos(frameState, vectorSource);
 
-  if (!this.dirty_ && (frameState.viewHints[ol.ViewHint.ANIMATING] ||
+  if (!this.dirty_ && (!vectorLayer.getUpdateWhileAnimating() &&
+      frameState.viewHints[ol.ViewHint.ANIMATING] ||
       frameState.viewHints[ol.ViewHint.INTERACTING])) {
     return true;
   }

src/ol/renderer/dom/domvectorlayerrenderer.js

@@ -229,7 +229,8 @@ ol.renderer.dom.VectorLayer.prototype.prepareFrame =
       frameState.attributions, vectorSource.getAttributions());
   this.updateLogos(frameState, vectorSource);
 
-  if (!this.dirty_ && (frameState.viewHints[ol.ViewHint.ANIMATING] ||
+  if (!this.dirty_ && (!vectorLayer.getUpdateWhileAnimating() &&
+      frameState.viewHints[ol.ViewHint.ANIMATING] ||
       frameState.viewHints[ol.ViewHint.INTERACTING])) {
     return true;
   }

src/ol/renderer/webgl/webglvectorlayerrenderer.js

@@ -128,7 +128,8 @@ ol.renderer.webgl.VectorLayer.prototype.prepareFrame =
       frameState.attributions, vectorSource.getAttributions());
   this.updateLogos(frameState, vectorSource);
 
-  if (!this.dirty_ && (frameState.viewHints[ol.ViewHint.ANIMATING] ||
+  if (!this.dirty_ && (!vectorLayer.getUpdateWhileAnimating() &&
+      frameState.viewHints[ol.ViewHint.ANIMATING] ||
       frameState.viewHints[ol.ViewHint.INTERACTING])) {
     return true;
   }