Merge pull request #11559 from MoonE/multi-world-only-draw-visible

Only draw visible worlds

src/ol/renderer/canvas/VectorLayer.js

@@ -219,38 +219,17 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
       viewHints[ViewHint.ANIMATING] || viewHints[ViewHint.INTERACTING]
     );
 
-    const transform = this.getRenderTransform(
-      center,
-      resolution,
-      rotation,
-      pixelRatio,
-      width,
-      height,
-      0
-    );
     const declutterReplays = this.getLayer().getDeclutter() ? {} : null;
-    replayGroup.execute(
-      context,
-      1,
-      transform,
-      rotation,
-      snapToPixel,
-      undefined,
-      declutterReplays
-    );
 
-    if (
+    const multiWorld = vectorSource.getWrapX() && projection.canWrapX();
-      vectorSource.getWrapX() &&
+    const worldWidth = multiWorld ? getWidth(projectionExtent) : null;
-      projection.canWrapX() &&
+    const endWorld = multiWorld
-      !containsExtent(projectionExtent, extent)
+      ? Math.ceil((extent[2] + projectionExtent[2]) / worldWidth)
-    ) {
+      : 1;
-      let startX = extent[0];
+    let world = multiWorld
-      const worldWidth = getWidth(projectionExtent);
+      ? Math.floor((extent[0] - projectionExtent[0]) / worldWidth)
-      let world = 0;
+      : 0;
-      let offsetX;
+    do {
-      while (startX < projectionExtent[0]) {
-        --world;
-        offsetX = worldWidth * world;
       const transform = this.getRenderTransform(
         center,
         resolution,
@@ -258,7 +237,7 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
         pixelRatio,
         width,
         height,
-          offsetX
+        world * worldWidth
       );
       replayGroup.execute(
         context,
@@ -269,34 +248,8 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
         undefined,
         declutterReplays
       );
-        startX += worldWidth;
+    } while (++world < endWorld);
-      }
+
-      world = 0;
-      startX = extent[2];
-      while (startX > projectionExtent[2]) {
-        ++world;
-        offsetX = worldWidth * world;
-        const transform = this.getRenderTransform(
-          center,
-          resolution,
-          rotation,
-          pixelRatio,
-          width,
-          height,
-          offsetX
-        );
-        replayGroup.execute(
-          context,
-          1,
-          transform,
-          rotation,
-          snapToPixel,
-          undefined,
-          declutterReplays
-        );
-        startX -= worldWidth;
-      }
-    }
     if (declutterReplays) {
       const viewHints = frameState.viewHints;
       const hifi = !(