Get simplified transformed geometry and load features in user projection

src/ol/renderer/canvas/VectorLayer.js

@@ -4,7 +4,7 @@
 import {getUid} from '../../util.js';
 import ViewHint from '../../ViewHint.js';
 import {buffer, createEmpty, containsExtent, getWidth, intersects as intersectsExtent} from '../../extent.js';
-import {fromUserExtent} from '../../proj.js';
+import {fromUserExtent, toUserExtent, getUserProjection} from '../../proj.js';
 import CanvasBuilderGroup from '../../render/canvas/BuilderGroup.js';
 import ExecutorGroup, {replayDeclutter} from '../../render/canvas/ExecutorGroup.js';
 import CanvasLayerRenderer from './Layer.js';
@@ -304,7 +304,12 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
       getRenderTolerance(resolution, pixelRatio), extent, resolution,
       pixelRatio, vectorLayer.getDeclutter());
 
-    vectorSource.loadFeatures(extent, resolution, projection);
+    const userProjection = getUserProjection();
+    if (userProjection) {
+      vectorSource.loadFeatures(toUserExtent(extent, projection), resolution, userProjection);
+    } else {
+      vectorSource.loadFeatures(extent, resolution, projection);
+    }
 
     const squaredTolerance = getSquaredRenderTolerance(resolution, pixelRatio);
 
@@ -319,15 +324,16 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
         styles = styleFunction(feature, resolution);
       }
       if (styles) {
-        const dirty = this.renderFeature(feature, squaredTolerance, styles, replayGroup);
+        const dirty = this.renderFeature(feature, squaredTolerance, styles, replayGroup, projection);
         this.dirty_ = this.dirty_ || dirty;
       }
     }.bind(this);
 
+    const userExtent = toUserExtent(extent, projection);
     if (vectorLayerRenderOrder) {
       /** @type {Array<import("../../Feature.js").default>} */
       const features = [];
-      vectorSource.forEachFeatureInExtent(extent,
+      vectorSource.forEachFeatureInExtent(userExtent,
         /**
          * @param {import("../../Feature.js").default} feature Feature.
          */
@@ -339,7 +345,7 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
         render(features[i]);
       }
     } else {
-      vectorSource.forEachFeatureInExtent(extent, render);
+      vectorSource.forEachFeatureInExtent(userExtent, render);
     }
 
     const replayGroupInstructions = replayGroup.finish();
@@ -362,9 +368,10 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
    * @param {number} squaredTolerance Squared render tolerance.
    * @param {import("../../style/Style.js").default|Array<import("../../style/Style.js").default>} styles The style or array of styles.
    * @param {import("../../render/canvas/BuilderGroup.js").default} builderGroup Builder group.
+   * @param {import("../../proj/Projection.js").default} projection The view projection.
    * @return {boolean} `true` if an image is loading.
    */
-  renderFeature(feature, squaredTolerance, styles, builderGroup) {
+  renderFeature(feature, squaredTolerance, styles, builderGroup, projection) {
     if (!styles) {
       return false;
     }
@@ -373,12 +380,12 @@ class CanvasVectorLayerRenderer extends CanvasLayerRenderer {
       for (let i = 0, ii = styles.length; i < ii; ++i) {
         loading = renderFeature(
           builderGroup, feature, styles[i], squaredTolerance,
-          this.boundHandleStyleImageChange_) || loading;
+          this.boundHandleStyleImageChange_, projection) || loading;
       }
     } else {
       loading = renderFeature(
         builderGroup, feature, styles, squaredTolerance,
-        this.boundHandleStyleImageChange_);
+        this.boundHandleStyleImageChange_, projection);
     }
     return loading;
   }

src/ol/renderer/vector.js

@@ -5,6 +5,7 @@ import {getUid} from '../util.js';
 import ImageState from '../ImageState.js';
 import GeometryType from '../geom/GeometryType.js';
 import BuilderType from '../render/canvas/BuilderType.js';
+import {getUserProjection} from '../proj.js';
 
 
 /**
@@ -92,10 +93,11 @@ function renderCircleGeometry(builderGroup, geometry, style, feature) {
  * @param {import("../style/Style.js").default} style Style.
  * @param {number} squaredTolerance Squared tolerance.
  * @param {function(import("../events/Event.js").default): void} listener Listener function.
+ * @param {import("../proj/Projection.js").default} projection The view projection.
  * @return {boolean} `true` if style is loading.
  * @template T
  */
-export function renderFeature(replayGroup, feature, style, squaredTolerance, listener) {
+export function renderFeature(replayGroup, feature, style, squaredTolerance, listener, projection) {
   let loading = false;
   const imageStyle = style.getImage();
   if (imageStyle) {
@@ -111,7 +113,7 @@ export function renderFeature(replayGroup, feature, style, squaredTolerance, lis
       loading = true;
     }
   }
-  renderFeatureInternal(replayGroup, feature, style, squaredTolerance);
+  renderFeatureInternal(replayGroup, feature, style, squaredTolerance, projection);
 
   return loading;
 }
@@ -122,13 +124,14 @@ export function renderFeature(replayGroup, feature, style, squaredTolerance, lis
  * @param {import("../Feature.js").FeatureLike} feature Feature.
  * @param {import("../style/Style.js").default} style Style.
  * @param {number} squaredTolerance Squared tolerance.
+ * @param {import("../proj/Projection.js").default} projection The view projection.
  */
-function renderFeatureInternal(replayGroup, feature, style, squaredTolerance) {
+function renderFeatureInternal(replayGroup, feature, style, squaredTolerance, projection) {
   const geometry = style.getGeometryFunction()(feature);
   if (!geometry) {
     return;
   }
-  const simplifiedGeometry = geometry.getSimplifiedGeometry(squaredTolerance);
+  const simplifiedGeometry = geometry.simplifyTransformed(squaredTolerance, getUserProjection(), projection);
   const renderer = style.getRenderer();
   if (renderer) {
     renderGeometry(replayGroup, simplifiedGeometry, style, feature);