Add an image vector layer for rendering vectors to an image

src/ol/layer/BaseVector.js

@@ -3,7 +3,6 @@
  */
 import LayerType from '../LayerType.js';
 import Layer from './Layer.js';
-import VectorRenderType from './VectorRenderType.js';
 import {assign} from '../obj.js';
 import {createDefaultStyle, toFunction as toStyleFunction} from '../style/Style.js';
 
@@ -28,11 +27,6 @@ import {createDefaultStyle, toFunction as toStyleFunction} from '../style/Style.
  * @property {number} [renderBuffer=100] The buffer in pixels around the viewport extent used by the
  * renderer when getting features from the vector source for the rendering or hit-detection.
  * Recommended value: the size of the largest symbol, line width or label.
- * @property {import("./VectorRenderType.js").default|string} [renderMode='vector'] Render mode for vector layers:
- *  * `'image'`: Vector layers are rendered as images. Great performance, but point symbols and
- *    texts are always rotated with the view and pixels are scaled during zoom animations.
- *  * `'vector'`: Vector layers are rendered as vectors. Most accurate rendering even during
- *    animations, but slower performance.
  * @property {import("../source/Vector.js").default} [source] Source.
  * @property {import("../PluggableMap.js").default} [map] Sets the layer as overlay on a map. The map will not manage
  * this layer in its layers collection, and the layer will be rendered on top. This is useful for
@@ -43,14 +37,12 @@ import {createDefaultStyle, toFunction as toStyleFunction} from '../style/Style.
  * means higher priority.
  * @property {import("../style/Style.js").StyleLike} [style] Layer style. See
  * {@link module:ol/style} for default style which will be used if this is not defined.
- * @property {boolean} [updateWhileAnimating=false] When set to `true` and `renderMode`
- * is `vector`, 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.
- * @property {boolean} [updateWhileInteracting=false] When set to `true` and `renderMode`
- * is `vector`, feature batches will be recreated during interactions. See also
- * `updateWhileAnimating`.
+ * @property {boolean} [updateWhileAnimating=false] 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.
+ * @property {boolean} [updateWhileInteracting=false] When set to `true`, feature batches will
+ * be recreated during interactions. See also `updateWhileAnimating`.
  */
 
 
@@ -131,12 +123,6 @@ class BaseVectorLayer extends Layer {
     this.updateWhileInteracting_ = options.updateWhileInteracting !== undefined ?
       options.updateWhileInteracting : false;
 
-    /**
-     * @private
-     * @type {import("./VectorTileRenderType.js").default|string}
-     */
-    this.renderMode_ = options.renderMode || VectorRenderType.VECTOR;
-
     /**
      * The layer type.
      * @protected
@@ -237,12 +223,6 @@ class BaseVectorLayer extends Layer {
     this.changed();
   }
 
-  /**
-   * @return {import("./VectorRenderType.js").default|string} The render mode.
-   */
-  getRenderMode() {
-    return this.renderMode_;
-  }
 }
 
 

src/ol/layer/Heatmap.js

@@ -34,11 +34,6 @@ import Style from '../style/Style.js';
  * @property {string|function(import("../Feature.js").default):number} [weight='weight'] The feature
  * attribute to use for the weight or a function that returns a weight from a feature. Weight values
  * should range from 0 to 1 (and values outside will be clamped to that range).
- * @property {import("./VectorRenderType.js").default|string} [renderMode='vector'] Render mode for vector layers:
- *  * `'image'`: Vector layers are rendered as images. Great performance, but point symbols and
- *    texts are always rotated with the view and pixels are scaled during zoom animations.
- *  * `'vector'`: Vector layers are rendered as vectors. Most accurate rendering even during
- *    animations, but slower performance.
  * @property {import("../source/Vector.js").default} [source] Source.
  */
 

src/ol/layer/VectorImage.js

@@ -0,0 +1,40 @@
+/**
+ * @module ol/layer/VectorImage
+ */
+import BaseVectorLayer from './BaseVector.js';
+import CanvasVectorImageLayerRenderer from '../renderer/canvas/VectorImageLayer.js';
+
+/**
+ * @typedef {import("./BaseVector.js").Options} Options
+ */
+
+
+/**
+ * @classdesc
+ * Vector data that is rendered client-side.
+ * Note that any property set in the options is set as a {@link module:ol/Object~BaseObject}
+ * property on the layer object; for example, setting `title: 'My Title'` in the
+ * options means that `title` is observable, and has get/set accessors.
+ *
+ * @api
+ */
+class VectorImageLayer extends BaseVectorLayer {
+  /**
+   * @param {Options=} opt_options Options.
+   */
+  constructor(opt_options) {
+    super(opt_options);
+  }
+
+  /**
+   * Create a renderer for this layer.
+   * @return {import("../renderer/Layer.js").default} A layer renderer.
+   * @protected
+   */
+  createRenderer() {
+    return new CanvasVectorImageLayerRenderer(this);
+  }
+}
+
+
+export default VectorImageLayer;

src/ol/layer/VectorRenderType.js

@@ -1,18 +0,0 @@
-/**
- * @module ol/layer/VectorRenderType
- */
-
-/**
- * @enum {string}
- * Render mode for vector layers:
- *  * `'image'`: Vector layers are rendered as images. Great performance, but
- *    point symbols and texts are always rotated with the view and pixels are
- *    scaled during zoom animations.
- *  * `'vector'`: Vector layers are rendered as vectors. Most accurate rendering
- *    even during animations, but slower performance.
- * @api
- */
-export default {
-  IMAGE: 'image',
-  VECTOR: 'vector'
-};

src/ol/layer/VectorTile.js

@@ -86,22 +86,28 @@ class VectorTileLayer extends BaseVectorLayer {
   constructor(opt_options) {
     const options = opt_options ? opt_options : {};
 
+    const baseOptions = /** @type {Object} */ (assign({}, options));
+    delete baseOptions.preload;
+    delete baseOptions.useInterimTilesOnError;
+
+    super(/** @type {import("./Vector.js").Options} */ (baseOptions));
+
     let renderMode = options.renderMode || VectorTileRenderType.HYBRID;
     assert(renderMode == undefined ||
        renderMode == VectorTileRenderType.IMAGE ||
        renderMode == VectorTileRenderType.HYBRID ||
        renderMode == VectorTileRenderType.VECTOR,
     28); // `renderMode` must be `'image'`, `'hybrid'` or `'vector'`
+
     if (options.declutter && renderMode == VectorTileRenderType.IMAGE) {
       renderMode = VectorTileRenderType.HYBRID;
     }
-    options.renderMode = renderMode;
 
-    const baseOptions = /** @type {Object} */ (assign({}, options));
-    delete baseOptions.preload;
-    delete baseOptions.useInterimTilesOnError;
-
-    super(/** @type {import("./Vector.js").Options} */ (baseOptions));
+    /**
+     * @private
+     * @type {VectorTileRenderType}
+     */
+    this.renderMode_ = renderMode;
 
     this.setPreload(options.preload ? options.preload : 0);
     this.setUseInterimTilesOnError(options.useInterimTilesOnError !== undefined ?
@@ -124,6 +130,13 @@ class VectorTileLayer extends BaseVectorLayer {
     return new CanvasVectorTileLayerRenderer(this);
   }
 
+  /**
+   * @return {VectorTileRenderType} The render mode.
+   */
+  getRenderMode() {
+    return this.renderMode_;
+  }
+
   /**
   * Return the level as number to which we will preload tiles up to.
   * @return {number} The level to preload tiles up to.