Merge pull request #8769 from schmidtk/ts-render-canvas

Fix type check errors in ol/render/canvas

src/ol/render/canvas/Immediate.js

@@ -577,7 +577,7 @@ class CanvasImmediateRenderer extends VectorContext {
       const context = this.context_;
       const flatCoordinates = geometry.getFlatCoordinates();
       let offset = 0;
-      const ends = geometry.getEnds();
+      const ends = /** @type {Array<number>} */ (geometry.getEnds());
       const stride = geometry.getStride();
       context.beginPath();
       for (let i = 0, ii = ends.length; i < ii; ++i) {
@@ -612,7 +612,7 @@ class CanvasImmediateRenderer extends VectorContext {
       const context = this.context_;
       context.beginPath();
       this.drawRings_(geometry.getOrientedFlatCoordinates(),
-        0, geometry.getEnds(), geometry.getStride());
+        0, /** @type {Array<number>} */ (geometry.getEnds()), geometry.getStride());
       if (this.fillState_) {
         context.fill();
       }
@@ -693,12 +693,12 @@ class CanvasImmediateRenderer extends VectorContext {
     const context = this.context_;
     const contextStrokeState = this.contextStrokeState_;
     if (!contextStrokeState) {
-      context.lineCap = strokeState.lineCap;
+      context.lineCap = /** @type {CanvasLineCap} */ (strokeState.lineCap);
       if (CANVAS_LINE_DASH) {
         context.setLineDash(strokeState.lineDash);
         context.lineDashOffset = strokeState.lineDashOffset;
       }
-      context.lineJoin = strokeState.lineJoin;
+      context.lineJoin = /** @type {CanvasLineJoin} */ (strokeState.lineJoin);
       context.lineWidth = strokeState.lineWidth;
       context.miterLimit = strokeState.miterLimit;
       context.strokeStyle = strokeState.strokeStyle;
@@ -713,7 +713,7 @@ class CanvasImmediateRenderer extends VectorContext {
       };
     } else {
       if (contextStrokeState.lineCap != strokeState.lineCap) {
-        contextStrokeState.lineCap = context.lineCap = strokeState.lineCap;
+        contextStrokeState.lineCap = context.lineCap = /** @type {CanvasLineCap} */ (strokeState.lineCap);
       }
       if (CANVAS_LINE_DASH) {
         if (!equals(contextStrokeState.lineDash, strokeState.lineDash)) {
@@ -725,7 +725,7 @@ class CanvasImmediateRenderer extends VectorContext {
         }
       }
       if (contextStrokeState.lineJoin != strokeState.lineJoin) {
-        contextStrokeState.lineJoin = context.lineJoin = strokeState.lineJoin;
+        contextStrokeState.lineJoin = context.lineJoin = /** @type {CanvasLineJoin} */ (strokeState.lineJoin);
       }
       if (contextStrokeState.lineWidth != strokeState.lineWidth) {
         contextStrokeState.lineWidth = context.lineWidth = strokeState.lineWidth;
@@ -752,8 +752,8 @@ class CanvasImmediateRenderer extends VectorContext {
       textState.textAlign : defaultTextAlign;
     if (!contextTextState) {
       context.font = textState.font;
-      context.textAlign = textAlign;
-      context.textBaseline = textState.textBaseline;
+      context.textAlign = /** @type {CanvasTextAlign} */ (textAlign);
+      context.textBaseline = /** @type {CanvasTextBaseline} */ (textState.textBaseline);
       this.contextTextState_ = {
         font: textState.font,
         textAlign: textAlign,
@@ -764,11 +764,11 @@ class CanvasImmediateRenderer extends VectorContext {
         contextTextState.font = context.font = textState.font;
       }
       if (contextTextState.textAlign != textAlign) {
-        contextTextState.textAlign = context.textAlign = textAlign;
+        contextTextState.textAlign = context.textAlign = /** @type {CanvasTextAlign} */ (textAlign);
       }
       if (contextTextState.textBaseline != textState.textBaseline) {
         contextTextState.textBaseline = context.textBaseline =
-            textState.textBaseline;
+          /** @type {CanvasTextBaseline} */ (textState.textBaseline);
       }
     }
   }

src/ol/render/canvas/Replay.js

@@ -485,8 +485,8 @@ class CanvasReplay extends VectorContext {
   setStrokeStyle_(context, instruction) {
     context.strokeStyle = /** @type {import("../../colorlike.js").ColorLike} */ (instruction[1]);
     context.lineWidth = /** @type {number} */ (instruction[2]);
-    context.lineCap = /** @type {string} */ (instruction[3]);
-    context.lineJoin = /** @type {string} */ (instruction[4]);
+    context.lineCap = /** @type {CanvasLineCap} */ (instruction[3]);
+    context.lineJoin = /** @type {CanvasLineJoin} */ (instruction[4]);
     context.miterLimit = /** @type {number} */ (instruction[5]);
     if (CANVAS_LINE_DASH) {
       context.lineDashOffset = /** @type {number} */ (instruction[7]);
@@ -723,7 +723,8 @@ class CanvasReplay extends VectorContext {
           const pathLength = lineStringLength(pixelCoordinates, begin, end, 2);
           const textLength = measure(text);
           if (overflow || textLength <= pathLength) {
-            const textAlign = /** @type {module:ol~render} */ (this).textStates[textKey].textAlign;
+            const textReplay = /** @type {import("./TextReplay.js").default} */ (this);
+            const textAlign = textReplay.textStates[textKey].textAlign;
             const startM = (pathLength - textLength) * TEXT_ALIGN[textAlign];
             const parts = drawTextOnPath(
               pixelCoordinates, begin, end, 2, text, measure, startM, maxAngle);
@@ -733,7 +734,7 @@ class CanvasReplay extends VectorContext {
                 for (c = 0, cc = parts.length; c < cc; ++c) {
                   part = parts[c]; // x, y, anchorX, rotation, chunk
                   chars = /** @type {string} */ (part[4]);
-                  label = /** @type {module:ol~render} */ (this).getImage(chars, textKey, '', strokeKey);
+                  label = textReplay.getImage(chars, textKey, '', strokeKey);
                   anchorX = /** @type {number} */ (part[2]) + strokeWidth;
                   anchorY = baseline * label.height + (0.5 - baseline) * 2 * strokeWidth - offsetY;
                   this.replayImage_(context,
@@ -747,7 +748,7 @@ class CanvasReplay extends VectorContext {
                 for (c = 0, cc = parts.length; c < cc; ++c) {
                   part = parts[c]; // x, y, anchorX, rotation, chunk
                   chars = /** @type {string} */ (part[4]);
-                  label = /** @type {module:ol~render} */ (this).getImage(chars, textKey, fillKey, '');
+                  label = textReplay.getImage(chars, textKey, fillKey, '');
                   anchorX = /** @type {number} */ (part[2]);
                   anchorY = baseline * label.height - offsetY;
                   this.replayImage_(context,
@@ -976,6 +977,7 @@ class CanvasReplay extends VectorContext {
    */
   createFill(state, geometry) {
     const fillStyle = state.fillStyle;
+    /** @type {Array<*>} */
     const fillInstruction = [CanvasInstruction.SET_FILL_STYLE, fillStyle];
     if (typeof fillStyle !== 'string') {
       // Fill is a pattern or gradient - align it!

src/ol/render/canvas/TextReplay.js

@@ -288,8 +288,8 @@ class CanvasTextReplay extends CanvasReplay {
       if (strokeKey) {
         context.strokeStyle = strokeState.strokeStyle;
         context.lineWidth = strokeWidth;
-        context.lineCap = strokeState.lineCap;
-        context.lineJoin = strokeState.lineJoin;
+        context.lineCap = /** @type {CanvasLineCap} */ (strokeState.lineCap);
+        context.lineJoin = /** @type {CanvasLineJoin} */ (strokeState.lineJoin);
         context.miterLimit = strokeState.miterLimit;
         if (CANVAS_LINE_DASH && strokeState.lineDash.length) {
           context.setLineDash(strokeState.lineDash);