Fix rendering VectorImage with no features in view extent

src/ol/renderer/canvas/VectorImageLayer.js

@@ -120,6 +120,7 @@ class CanvasVectorImageLayerRenderer extends CanvasImageLayerRenderer {
             ),
           })
         );
+      let emptyImage = true;
       const image = new ImageCanvas(
         renderedExtent,
         viewResolution,
@@ -131,8 +132,10 @@ class CanvasVectorImageLayerRenderer extends CanvasImageLayerRenderer {
             vectorRenderer.replayGroupChanged
           ) {
             vectorRenderer.clipping = false;
-            vectorRenderer.renderFrame(imageFrameState, null);
+            if (vectorRenderer.renderFrame(imageFrameState, null)) {
               vectorRenderer.renderDeclutter(imageFrameState);
+              emptyImage = false;
+            }
             callback();
           }
         }
@@ -141,8 +144,10 @@ class CanvasVectorImageLayerRenderer extends CanvasImageLayerRenderer {
       image.addEventListener(
         EventType.CHANGE,
         function () {
-          if (image.getState() === ImageState.LOADED) {
+          if (image.getState() !== ImageState.LOADED) {
-            this.image_ = image;
+            return;
+          }
+          this.image_ = emptyImage ? null : image;
           const imageResolution = image.getResolution();
           const imagePixelRatio = image.getPixelRatio();
           const renderedResolution =
@@ -158,7 +163,6 @@ class CanvasVectorImageLayerRenderer extends CanvasImageLayerRenderer {
             -viewState.center[0],
             -viewState.center[1]
           );
-          }
         }.bind(this)
       );
       image.load();