Merge pull request #11990 from ahocevar/remove-vectortile-image-mode

Remove renderMode: 'image' for vector tile layers

changelog/upgrade-notes.md

@@ -1,5 +1,11 @@
 ## Upgrade notes
 
+### Next version
+
+#### Deprecation of `image` render mode for vector tile layers
+
+`renderMode: 'image'` for vector tile layers has been deprecated. Applications continue to work, but a warning will be issued to the console. To get rid of the warning, simply remove the `renderMode` option.
+
 ### v6.5.0
 
 #### Units of the `hitTolerance` option fixed

doc/errors/index.md

@@ -111,7 +111,7 @@ Features for `updates` must have an id set by the feature reader or `ol.Feature#
 
 ### 28
 
-`renderMode` must be `'image'`, `'hybrid'` or `'vector'`.
+`renderMode` must be `'hybrid'` or `'vector'`.
 
 ### 29
 

src/ol/layer/MapboxVector.js

@@ -193,10 +193,6 @@ const SourceType = {
  * the largest possible buffer of the used tiles. It should be at least the size of the largest
  * point symbol or line width.
  * @property {import("./VectorTileRenderType.js").default|string} [renderMode='hybrid'] Render mode for vector tiles:
- *  * `'image'`: Vector tiles are rendered as images. Great performance, but point symbols and texts
- *    are always rotated with the view and pixels are scaled during zoom animations. When `declutter`
- *    is set to `true`, the decluttering is done per tile resulting in labels and point symbols getting
- *    cut off at tile boundaries.
  *  * `'hybrid'`: Polygon and line elements are rendered as images, so pixels are scaled during zoom
  *    animations. Point symbols and texts are accurately rendered as vectors and can stay upright on
  *    rotated views.

src/ol/layer/VectorTile.js

@@ -36,10 +36,6 @@ import {assign} from '../obj.js';
  * the largest possible buffer of the used tiles. It should be at least the size of the largest
  * point symbol or line width.
  * @property {import("./VectorTileRenderType.js").default|string} [renderMode='hybrid'] Render mode for vector tiles:
- *  * `'image'`: Vector tiles are rendered as images. Only available when `declutter` is set to `false` (default).
- *    Otherwise, `'hybrid'` mode will used instead. Great performance, but point symbols and texts
- *    are always rotated with the view and pixels are scaled during zoom animations. Labels and point symbols will
- *    get cut off at tile boundaries.
  *  * `'hybrid'`: Polygon and line elements are rendered as images, so pixels are scaled during zoom
  *    animations. Point symbols and texts are accurately rendered as vectors and can stay upright on
  *    rotated views.
@@ -93,14 +89,19 @@ class VectorTileLayer extends BaseVectorLayer {
 
     super(/** @type {import("./BaseVector.js").Options} */ (baseOptions));
 
-    const renderMode = options.renderMode || VectorTileRenderType.HYBRID;
+    let renderMode = options.renderMode || VectorTileRenderType.HYBRID;
+    if (renderMode === VectorTileRenderType.IMAGE) {
+      //FIXME deprecated - remove this check in v7.
+      //eslint-disable-next-line
+      console.warn('renderMode: "image" is deprecated. Option ignored.')
+      renderMode = undefined;
+    }
     assert(
       renderMode == undefined ||
-        renderMode == VectorTileRenderType.IMAGE ||
         renderMode == VectorTileRenderType.HYBRID ||
         renderMode == VectorTileRenderType.VECTOR,
       28
-    ); // `renderMode` must be `'image'`, `'hybrid'` or `'vector'`.
+    ); // `renderMode` must be `'hybrid'` or `'vector'`.
 
     /**
      * @private

src/ol/layer/VectorTileRenderType.js

@@ -5,20 +5,30 @@
 /**
  * @enum {string}
  * Render mode for vector tiles:
- *  * `'image'`: Vector tiles are rendered as images. Great performance, but
- *    point symbols and texts are always rotated with the view and pixels are
- *    scaled during zoom animations.
- *  * `'hybrid'`: Polygon and line elements are rendered as images, so pixels
- *    are scaled during zoom animations. Point symbols and texts are accurately
- *    rendered as vectors and can stay upright on rotated views.
- *  * `'vector'`: Everything is rendered as vectors. Use this mode for improved
- *    performance on vector tile layers with only a few rendered features (e.g.
- *    for highlighting a subset of features of another layer with the same
- *    source).
  * @api
  */
 export default {
+  /**
+   * Vector tiles are rendered as images. Great performance, but
+   * point symbols and texts are always rotated with the view and pixels are
+   * scaled during zoom animations
+   * @api
+   * @deprecated
+   */
   IMAGE: 'image',
+  /**
+   * Polygon and line elements are rendered as images, so pixels
+   * are scaled during zoom animations. Point symbols and texts are accurately
+   * rendered as vectors and can stay upright on rotated views.
+   * @api
+   */
   HYBRID: 'hybrid',
+  /**
+   * Everything is rendered as vectors. Use this mode for improved
+   * performance on vector tile layers with only a few rendered features (e.g.
+   * for highlighting a subset of features of another layer with the same
+   * source).
+   * @api
+   */
   VECTOR: 'vector',
 };

src/ol/renderer/canvas/VectorTileLayer.js

@@ -60,7 +60,6 @@ const IMAGE_REPLAYS = {
  * @type {!Object<string, Array<import("../../render/canvas/BuilderType.js").default>>}
  */
 const VECTOR_REPLAYS = {
-  'image': [ReplayType.DEFAULT],
   'hybrid': [ReplayType.IMAGE, ReplayType.TEXT, ReplayType.DEFAULT],
   'vector': [
     ReplayType.POLYGON,
@@ -686,9 +685,6 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
 
     const layer = /** @type {import("../../layer/VectorTile.js").default} */ (this.getLayer());
     const renderMode = layer.getRenderMode();
-    if (renderMode === VectorTileRenderType.IMAGE) {
-      return this.container;
-    }
 
     const source = layer.getSource();
     // Unqueue tiles from the image queue when we don't need any more

test/spec/ol/layer/vectortile.test.js

@@ -43,11 +43,6 @@ describe('ol.layer.VectorTile', function () {
         source: new VectorTileSource({}),
       });
       expect(layer.getRenderMode()).to.be('hybrid');
-      layer = new VectorTileLayer({
-        renderMode: 'image',
-        source: new VectorTileSource({}),
-      });
-      expect(layer.getRenderMode()).to.be('image');
       expect(function () {
         layer = new VectorTileLayer({
           renderMode: 'foo',

test/spec/ol/renderer/canvas/vectortilelayer.test.js

@@ -117,23 +117,6 @@ describe('ol.renderer.canvas.VectorTileLayer', function () {
       expect(renderer.getLayer()).to.be(layer);
     });
 
-    it('does not render replays for pure image rendering', function () {
-      const testLayer = new VectorTileLayer({
-        renderMode: VectorTileRenderType.IMAGE,
-        source: source,
-        style: layerStyle,
-      });
-      map.removeLayer(layer);
-      map.addLayer(testLayer);
-      const spy = sinon.spy(
-        CanvasVectorTileLayerRenderer.prototype,
-        'getRenderTransform'
-      );
-      map.renderSync();
-      expect(spy.callCount).to.be(0);
-      spy.restore();
-    });
-
     it('does not render images for pure vector rendering', function () {
       const testLayer = new VectorTileLayer({
         renderMode: VectorTileRenderType.VECTOR,