Merge pull request #8773 from schmidtk/ts-renderer-canvas

Fix type check errors in ol/renderer/canvas

src/ol/ImageCanvas.js

@@ -11,7 +11,7 @@ import ImageState from './ImageState.js';
  * If any error occurs during drawing, the "done" callback should be called with
  * that error.
  *
- * @typedef {function(function(Error))} Loader
+ * @typedef {function(function(Error=))} Loader
  */
 
 
@@ -62,7 +62,7 @@ class ImageCanvas extends ImageBase {
 
   /**
    * Handle async drawing complete.
-   * @param {Error} err Any error during drawing.
+   * @param {Error=} err Any error during drawing.
    * @private
    */
   handleLoad_(err) {

src/ol/renderer/Map.js

@@ -40,7 +40,7 @@ class MapRenderer extends Disposable {
 
     /**
      * @private
-     * @type {Array<import("./Layer.js").default>}
+     * @type {Array<typeof import("./Layer.js").default>}
      */
     this.layerRendererConstructors_ = [];
 
@@ -55,7 +55,7 @@ class MapRenderer extends Disposable {
 
   /**
    * Register layer renderer constructors.
-   * @param {Array<import("./Layer.js").default>} constructors Layer renderers.
+   * @param {Array<typeof import("./Layer.js").default>} constructors Layer renderers.
    */
   registerLayerRenderers(constructors) {
     this.layerRendererConstructors_.push.apply(this.layerRendererConstructors_, constructors);

src/ol/renderer/canvas/ImageLayer.js

@@ -54,7 +54,7 @@ class CanvasImageLayerRenderer extends IntermediateCanvasRenderer {
       for (let i = 0, ii = layerRendererConstructors.length; i < ii; ++i) {
         const ctor = layerRendererConstructors[i];
         if (ctor !== CanvasImageLayerRenderer && ctor['handles'](imageLayer)) {
-          this.vectorRenderer_ = new ctor(imageLayer);
+          this.vectorRenderer_ = /** @type {import("./VectorLayer.js").default} */ (new ctor(imageLayer));
           break;
         }
       }
@@ -99,7 +99,7 @@ class CanvasImageLayerRenderer extends IntermediateCanvasRenderer {
 
     let image;
     const imageLayer = /** @type {import("../../layer/Image.js").default} */ (this.getLayer());
-    const imageSource = imageLayer.getSource();
+    const imageSource = /** @type {import("../../source/Image.js").default} */ (imageLayer.getSource());
 
     const hints = frameState.viewHints;
 

src/ol/renderer/canvas/Map.js

@@ -15,7 +15,7 @@ import SourceState from '../../source/State.js';
 
 
 /**
- * @type {Array<import("../Layer.js").default>}
+ * @type {Array<typeof import("../Layer.js").default>}
  */
 export const layerRendererConstructors = [];
 
@@ -145,11 +145,11 @@ class CanvasMapRenderer extends MapRenderer {
     }
 
     const viewResolution = frameState.viewState.resolution;
-    let i, ii, layer, layerRenderer, layerState;
+    let i, ii;
     for (i = 0, ii = layerStatesArray.length; i < ii; ++i) {
-      layerState = layerStatesArray[i];
+      const layerState = layerStatesArray[i];
-      layer = layerState.layer;
+      const layer = layerState.layer;
-      layerRenderer = /** @type {import("./Layer.js").default} */ (this.getLayerRenderer(layer));
+      const layerRenderer = /** @type {import("./Layer.js").default} */ (this.getLayerRenderer(layer));
       if (!visibleAtResolution(layerState, viewResolution) ||
           layerState.sourceState != SourceState.READY) {
         continue;

src/ol/renderer/canvas/TileLayer.js

@@ -94,8 +94,9 @@ class CanvasTileLayerRenderer extends IntermediateCanvasRenderer {
    * @return {boolean} Tile is drawable.
    */
   isDrawableTile_(tile) {
+    const tileLayer = /** @type {import("../../layer/Tile.js").default} */ (this.getLayer());
     const tileState = tile.getState();
-    const useInterimTilesOnError = this.getLayer().getUseInterimTilesOnError();
+    const useInterimTilesOnError = tileLayer.getUseInterimTilesOnError();
     return tileState == TileState.LOADED ||
         tileState == TileState.EMPTY ||
         tileState == TileState.ERROR && !useInterimTilesOnError;
@@ -110,14 +111,14 @@ class CanvasTileLayerRenderer extends IntermediateCanvasRenderer {
    * @return {!import("../../Tile.js").default} Tile.
    */
   getTile(z, x, y, pixelRatio, projection) {
-    const layer = this.getLayer();
+    const tileLayer = /** @type {import("../../layer/Tile.js").default} */ (this.getLayer());
-    const source = /** @type {import("../../source/Tile.js").default} */ (layer.getSource());
+    const tileSource = /** @type {import("../../source/Tile.js").default} */ (tileLayer.getSource());
-    let tile = source.getTile(z, x, y, pixelRatio, projection);
+    let tile = tileSource.getTile(z, x, y, pixelRatio, projection);
     if (tile.getState() == TileState.ERROR) {
-      if (!layer.getUseInterimTilesOnError()) {
+      if (!tileLayer.getUseInterimTilesOnError()) {
         // When useInterimTilesOnError is false, we consider the error tile as loaded.
         tile.setState(TileState.LOADED);
-      } else if (layer.getPreload() > 0) {
+      } else if (tileLayer.getPreload() > 0) {
         // Preloaded tiles for lower resolutions might have finished loading.
         this.newTiles_ = true;
       }
@@ -140,7 +141,7 @@ class CanvasTileLayerRenderer extends IntermediateCanvasRenderer {
     const viewResolution = viewState.resolution;
     const viewCenter = viewState.center;
 
-    const tileLayer = this.getLayer();
+    const tileLayer = /** @type {import("../../layer/Tile.js").default} */ (this.getLayer());
     const tileSource = /** @type {import("../../source/Tile.js").default} */ (tileLayer.getSource());
     const sourceRevision = tileSource.getRevision();
     const tileGrid = tileSource.getTileGridForProjection(projection);
@@ -312,13 +313,15 @@ class CanvasTileLayerRenderer extends IntermediateCanvasRenderer {
    * @param {boolean} transition Apply an alpha transition.
    */
   drawTileImage(tile, frameState, layerState, x, y, w, h, gutter, transition) {
-    const image = tile.getImage(this.getLayer());
+    const image = this.getTileImage(tile);
     if (!image) {
       return;
     }
     const uid = getUid(this);
     const alpha = transition ? tile.getAlpha(uid, frameState.time) : 1;
-    if (alpha === 1 && !this.getLayer().getSource().getOpaque(frameState.viewState.projection)) {
+    const tileLayer = /** @type {import("../../layer/Tile.js").default} */ (this.getLayer());
+    const tileSource = /** @type {import("../../source/Tile.js").default} */ (tileLayer.getSource());
+    if (alpha === 1 && !tileSource.getOpaque(frameState.viewState.projection)) {
       this.context.clearRect(x, y, w, h);
     }
     const alphaChanged = alpha !== this.context.globalAlpha;
@@ -353,6 +356,16 @@ class CanvasTileLayerRenderer extends IntermediateCanvasRenderer {
   getImageTransform() {
     return this.imageTransform_;
   }
+
+  /**
+   * Get the image from a tile.
+   * @param {import("../../Tile.js").default} tile Tile.
+   * @return {HTMLCanvasElement|HTMLImageElement|HTMLVideoElement} Image.
+   * @protected
+   */
+  getTileImage(tile) {
+    return /** @type {import("../../ImageTile.js").default} */ (tile).getImage();
+  }
 }
 
 

src/ol/renderer/canvas/VectorLayer.js

@@ -278,7 +278,7 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
    */
   prepareFrame(frameState, layerState) {
     const vectorLayer = /** @type {import("../../layer/Vector.js").default} */ (this.getLayer());
-    const vectorSource = vectorLayer.getSource();
+    const vectorSource = /** @type {import("../../source/Vector.js").default} */ (vectorLayer.getSource());
 
     const animating = frameState.viewHints[ViewHint.ANIMATING];
     const interacting = frameState.viewHints[ViewHint.INTERACTING];
@@ -362,13 +362,13 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
          */
         function(feature) {
           features.push(feature);
-        }, this);
+        });
       features.sort(vectorLayerRenderOrder);
       for (let i = 0, ii = features.length; i < ii; ++i) {
         render(features[i]);
       }
     } else {
-      vectorSource.forEachFeatureInExtent(extent, render, this);
+      vectorSource.forEachFeatureInExtent(extent, render);
     }
     replayGroup.finish();
 

src/ol/renderer/canvas/VectorTileLayer.js

@@ -107,19 +107,27 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
   getTile(z, x, y, pixelRatio, projection) {
     const tile = super.getTile(z, x, y, pixelRatio, projection);
     if (tile.getState() === TileState.LOADED) {
-      this.createReplayGroup_(tile, pixelRatio, projection);
+      this.createReplayGroup_(/** @type {import("../../VectorImageTile.js").default} */ (tile), pixelRatio, projection);
       if (this.context) {
-        this.renderTileImage_(tile, pixelRatio, projection);
+        this.renderTileImage_(/** @type {import("../../VectorImageTile.js").default} */ (tile), pixelRatio, projection);
       }
     }
     return tile;
   }
 
+  /**
+   * @inheritDoc
+   */
+  getTileImage(tile) {
+    const tileLayer = /** @type {import("../../layer/Tile.js").default} */ (this.getLayer());
+    return /** @type {import("../../VectorImageTile.js").default} */ (tile).getImage(tileLayer);
+  }
+
   /**
    * @inheritDoc
    */
   prepareFrame(frameState, layerState) {
-    const layer = this.getLayer();
+    const layer = /** @type {import("../../layer/Vector.js").default} */ (this.getLayer());
     const layerRevision = layer.getRevision();
     if (this.renderedLayerRevision_ != layerRevision) {
       this.renderedTiles.length = 0;
@@ -142,7 +150,7 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
    * @private
    */
   createReplayGroup_(tile, pixelRatio, projection) {
-    const layer = this.getLayer();
+    const layer = /** @type {import("../../layer/Vector.js").default} */ (this.getLayer());
     const revision = layer.getRevision();
     const renderOrder = /** @type {import("../../render.js").OrderFunction} */ (layer.getRenderOrder()) || null;
 
@@ -238,11 +246,10 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
     /** @type {!Object<string, boolean>} */
     const features = {};
 
-    /** @type {Array<import("../../VectorImageTile.js").default>} */
+    const renderedTiles = /** @type {Array<import("../../VectorImageTile.js").default>} */ (this.renderedTiles);
-    const renderedTiles = this.renderedTiles;
 
     let bufferedExtent, found;
-    let i, ii, replayGroup;
+    let i, ii;
     for (i = 0, ii = renderedTiles.length; i < ii; ++i) {
       const tile = renderedTiles[i];
       bufferedExtent = buffer(tile.extent, hitTolerance * resolution, bufferedExtent);
@@ -254,7 +261,8 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
         if (sourceTile.getState() != TileState.LOADED) {
           continue;
         }
-        replayGroup = sourceTile.getReplayGroup(layer, tile.tileCoord.toString());
+        const replayGroup = /** @type {CanvasReplayGroup} */ (sourceTile.getReplayGroup(layer,
+          tile.tileCoord.toString()));
         found = found || replayGroup.forEachFeatureAtCoordinate(coordinate, resolution, rotation, hitTolerance, {},
           /**
            * @param {import("../../Feature.js").FeatureLike} feature Feature.
@@ -324,7 +332,7 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
    * @inheritDoc
    */
   postCompose(context, frameState, layerState) {
-    const layer = this.getLayer();
+    const layer = /** @type {import("../../layer/Vector.js").default} */ (this.getLayer());
     const renderMode = layer.getRenderMode();
     if (renderMode != VectorTileRenderType.IMAGE) {
       const declutterReplays = layer.getDeclutter() ? {} : null;
@@ -361,7 +369,7 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
           if (sourceTile.getState() != TileState.LOADED) {
             continue;
           }
-          const replayGroup = sourceTile.getReplayGroup(layer, tileCoord.toString());
+          const replayGroup = /** @type {CanvasReplayGroup} */ (sourceTile.getReplayGroup(layer, tileCoord.toString()));
           if (!replayGroup || !replayGroup.hasReplays(replayTypes)) {
             // sourceTile was not yet loaded when this.createReplayGroup_() was
             // called, or it has no replays of the types we want to render
@@ -443,7 +451,7 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
    * @private
    */
   renderTileImage_(tile, pixelRatio, projection) {
-    const layer = this.getLayer();
+    const layer = /** @type {import("../../layer/Vector.js").default} */ (this.getLayer());
     const replayState = tile.getReplayState(layer);
     const revision = layer.getRevision();
     const replays = IMAGE_REPLAYS[layer.getRenderMode()];
@@ -468,7 +476,8 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
         const transform = resetTransform(this.tmpTransform_);
         scaleTransform(transform, pixelScale, -pixelScale);
         translateTransform(transform, -tileExtent[0], -tileExtent[3]);
-        const replayGroup = sourceTile.getReplayGroup(layer, tile.tileCoord.toString());
+        const replayGroup = /** @type {CanvasReplayGroup} */ (sourceTile.getReplayGroup(layer,
+          tile.tileCoord.toString()));
         replayGroup.replay(context, transform, 0, {}, true, replays);
       }
     }