Saved map resolutions and aligned with custom resolutions and projection of map

docs/developer-guide/mapstore-migration-guide.md

@@ -22,6 +22,31 @@ This is a list of things to check if you want to update from a previous version
 
 ## Migration from 2026.01.02 to 2026.02.00
 
+### Custom map resolutions moved from `new.json` to the `CRSSelector` plugin
+
+Custom map resolutions used to be declared in the default map configuration (`new.json`, or the project-level equivalent) under `mapOptions.view.resolutions`. That location was tied to a single projection and was not kept in sync when the CRS was changed at runtime, which could leave saved maps with a projection that did not match the persisted resolutions.
+
+Custom resolutions are declared **per CRS** in the `CRSSelector` plugin configuration in `localConfig.json`, keyed by SRS code:
+
+```json
+{
+  "name": "CRSSelector",
+  "cfg": {
+    "customResolutions": {
+      "EPSG:3003": [8000, 4000, 2000, 1000, 500, 250, 100, 50, 20, 10],
+      "EPSG:4326": [0.7, 0.35, 0.175, 0.0875, 0.04375, 0.021875]
+    }
+  }
+}
+```
+
+When the user switches the map CRS, the matching list of resolutions is applied to the map. If a CRS has no entry, the resolutions are computed from the projection extent. In either case the chosen list is saved together with the map so that, on reload, the CRS and the resolutions remain aligned.
+
+#### Migration steps
+
+1. Remove `mapOptions.view.resolutions` from `new.json` (and from any custom default map config used by the project). Any value left there is dropped on the next save.
+2. Add an equivalent `customResolutions` block to the `CRSSelector` plugin entry in `localConfig.json`, keyed by the SRS the resolutions were originally designed for.
+
 ### MetadataExplorer plugin renamed to Catalog
 
 The `MetadataExplorer` plugin has been replaced by the new `Catalog` plugin. Projects that include `MetadataExplorer` in their plugin configuration must update both `localConfig.json` and `pluginsConfig.json` (or the equivalent project configuration files) as follows:

web/client/components/map/openlayers/Map.jsx

@@ -361,14 +361,31 @@ class OpenlayersMap extends React.Component {
      * - custom grid set with custom extent. You need to customize the projection definition extent to make it work.
      * - custom grid set is partially supported by mapOptions.view.resolutions but this is not managed by projection change yet
      * - custom tile sizes
-     *
      */
     getResolutions = (srs) => {
-        if (this.props.mapOptions && this.props.mapOptions.view && this.props.mapOptions.view.resolutions) {
-            return this.props.mapOptions.view.resolutions;
+    // Resolve requested projection
+        const requestedProj = srs
+            ? msGetProjection(srs)
+            : (this.map?.getView()?.getProjection());
+        const requestedSRS = normalizeSRS(srs || requestedProj.getCode());
+
+        // Check for explicitly configured resolutions + matching projection
+        const viewOptions = this.props?.mapOptions?.view || {};
+        const configuredResolutions = viewOptions.resolutions;
+        const configuredResProjection = viewOptions.projection && normalizeSRS(viewOptions.projection);
+
+        // If resolutions are explicitly configured *and* tied to a projection that matches our target,
+        // return them directly — avoids recomputation and ensures consistency with custom tile sources.
+        if (
+            configuredResolutions &&
+        Array.isArray(configuredResolutions) &&
+        configuredResProjection &&
+        requestedSRS === configuredResProjection
+        ) {
+            return configuredResolutions;
         }
-        const projection = srs ? msGetProjection(srs) : this.map.getView().getProjection();
-        const extent = projection.extent || projection?.getExtent(); // get from registry crs item or ol map
+        // Otherwise compute dynamically
+        const extent = requestedProj.extent || requestedProj.getExtent();
         return getResolutionsForProjection(
             srs ?? this.map.getView().getProjection().getCode(),
             {
@@ -598,15 +615,34 @@ class OpenlayersMap extends React.Component {
     };
 
     createView = (center, zoom, projection, options, limits = {}) => {
+        const srs = normalizeSRS(projection);
         // limit has a crs defined
         const extent = limits.restrictedExtent && limits.crs && reprojectBbox(limits.restrictedExtent, limits.crs, normalizeSRS(projection));
-        const newOptions = !options || (options && !options.view) ? Object.assign({}, options, { extent }) : Object.assign({}, options);
+
+        // Determine whether to use configured resolutions
+        const configuredResolutions = options?.resolutions;
+        const configuredProj = normalizeSRS(options?.projection);
+
+        let resolutionsToUse;
+        if (configuredResolutions && configuredProj === srs) {
+            // use provided resolutions (keep backward compatibility)
+            resolutionsToUse = configuredResolutions;
+        } else {
+            // compute resolutions dynamically (e.g., EPSG:4326)
+            resolutionsToUse = this.getResolutions(srs);
+        }
+        const newOptions = {
+            ...options,
+            projection: srs,
+            resolutions: resolutionsToUse,
+            extent: options?.extent !== undefined ? options.extent : extent
+        };
         /*
         * setting the zoom level in the localConfig file is co-related to the projection extent(size)
         * it is recommended to use projections with the same coverage area (extent). If you want to have the same restricted zoom level (minZoom)
         */
         const viewOptions = Object.assign({}, {
-            projection: normalizeSRS(projection),
+            projection: srs,
             center: [center?.x || 0, center?.y || 0],
             zoom: zoom,
             minZoom: limits.minZoom,
@@ -615,7 +651,7 @@ class OpenlayersMap extends React.Component {
             // does not allow intermediary zoom levels
             // we need this at true to set correctly the scale box
             constrainResolution: true,
-            resolutions: this.getResolutions(normalizeSRS(projection))
+            resolutions: this.getResolutions(srs)
         }, newOptions || {});
         return new View(viewOptions);
     };

web/client/components/map/openlayers/__tests__/Map-test.jsx

@@ -1517,7 +1517,7 @@ describe('OpenlayersMap', () => {
             <OpenlayersMap
                 center={{y: 43.9, x: 10.3}}
                 zoom={11}
-                mapOptions={{view: { resolutions }}}
+                mapOptions={{view: { resolutions, projection: "EPSG:3857" }}}
             >
                 <OpenlayersLayer type="wms" srs="EPSG:3857" options={options} />
             </OpenlayersMap>, document.getElementById("map")
@@ -1574,7 +1574,7 @@ describe('OpenlayersMap', () => {
             <OpenlayersMap
                 center={{y: 43.9, x: 10.3}}
                 zoom={11}
-                mapOptions={{view: { resolutions }}}
+                mapOptions={{view: { resolutions, projection: "EPSG:3857" }}}
             >
                 <OpenlayersLayer type="wms" srs="EPSG:3857" options={options} />
             </OpenlayersMap>, document.getElementById("map")
@@ -1711,4 +1711,41 @@ describe('OpenlayersMap', () => {
         // center is modified
         expect(map.map.getView().getCenter()).toEqual([10.3346773790, 43.9323234388]);
     });
+    it('should correctly apply view projection without propagating to zoom changes', () => {
+        const resolutions = [0.0005, 0.0004, 0.0003, 0.0002];
+        const map = ReactDOM.render(
+            <OpenlayersMap
+                center={{y: 45, x: 10}}
+                zoom={2}
+                projection="EPSG:4326"
+                mapOptions={{ view: { projection: 'EPSG:4326', resolutions } }}
+            />,
+            document.getElementById("map")
+        );
+
+        const view = map.map.getView();
+        expect(view.getProjection().getCode()).toBe('EPSG:4326');
+        expect(view.getResolutions()).toEqual(resolutions); // Custom resolutions applied
+
+        // Simulate a zoom change
+        view.setZoom(3);
+        expect(view.getProjection().getCode()).toBe('EPSG:4326');
+
+        // Simulate receiving new props with a different projection
+        ReactDOM.render(
+            <OpenlayersMap
+                center={{y: 45, x: 10}}
+                zoom={3}
+                projection="EPSG:3857"
+                mapOptions={{ view: { projection: 'EPSG:4326', resolutions } }}
+            />,
+            document.getElementById("map")
+        );
+
+        const updatedView = map.map.getView();
+        updatedView.setZoom(5);
+        expect(updatedView.getProjection().getCode()).toBe('EPSG:3857');
+        expect(updatedView.getResolutions()).toNotEqual(resolutions);
+    });
+
 });

web/client/components/print/MapPreview.jsx

@@ -149,7 +149,8 @@ class MapPreview extends React.Component {
         let mapOptions = !isEmpty(resolutions) || !isNil(this.props.rotation) ? {
             view: {
                 ...(!isEmpty(resolutions) && {resolutions}),
-                rotation: !isNil(this.props.rotation) ? Number(this.props.rotation) : 0
+                rotation: !isNil(this.props.rotation) ? Number(this.props.rotation) : 0,
+                projection
             }
         } : {};
 

web/client/plugins/CRSSelector/__tests__/CRSSelector-test.jsx

@@ -6,6 +6,7 @@ import CRSSelectorPlugin from '../index';
 import { getPluginForTest } from '../../__tests__/pluginsTestUtils';
 import security from '../../../reducers/security';
 import ReactTestUtils from 'react-dom/test-utils';
+import { SET_PROJECTIONS_CONFIG } from '../actions/crsselector';
 
 const defaultAvailableProjections = [
     { value: "EPSG:4326", label: "EPSG:4326" },
@@ -490,4 +491,65 @@ describe('CRSSelector Plugin', () => {
             }
         }, 100);
     });
+
+    it('bridges pluginCfg.customResolutions into state.crsselector.config on mount', (done) => {
+        const customResolutions = {
+            'EPSG:4326': [1, 0.5, 0.25, 0.125]
+        };
+        const { Plugin, store } = getPluginForTest(CRSPluginCustomized, {
+            map: { projection: 'EPSG:4326' },
+            localConfig: { projectionDefs: [] },
+            security: { user: { role: 'USER' } }
+        });
+
+        ReactDOM.render(<Plugin
+            pluginCfg={{
+                availableProjections: defaultAvailableProjections,
+                customResolutions,
+                allowedRoles: ['ALL']
+            }}
+        />, document.getElementById('container'));
+
+        // The useEffect runs after the first paint, so wait a tick.
+        setTimeout(() => {
+            const config = store.getState().crsselector?.config;
+            expect(config).toExist();
+            expect(config.customResolutions).toEqual(customResolutions);
+            done();
+        }, 0);
+    });
+
+    it('does NOT bridge pluginCfg.customResolutions when state already has them (saved-map wins)', (done) => {
+        const savedCustomResolutions = { 'EPSG:4326': [9, 8, 7] };
+        const pluginCfgCustomResolutions = { 'EPSG:4326': [1, 0.5, 0.25] };
+        const { Plugin, store, actions } = getPluginForTest(CRSPluginCustomized, {
+            map: { projection: 'EPSG:4326' },
+            localConfig: { projectionDefs: [] },
+            security: { user: { role: 'USER' } },
+            crsselector: {
+                config: { customResolutions: savedCustomResolutions }
+            }
+        });
+
+        ReactDOM.render(<Plugin
+            pluginCfg={{
+                availableProjections: defaultAvailableProjections,
+                customResolutions: pluginCfgCustomResolutions,
+                allowedRoles: ['ALL']
+            }}
+        />, document.getElementById('container'));
+
+        setTimeout(() => {
+            const config = store.getState().crsselector?.config;
+            expect(config.customResolutions).toEqual(savedCustomResolutions);
+            // The bridge should not have emitted a SET_PROJECTIONS_CONFIG to
+            // overwrite the saved-map customResolutions with the pluginCfg ones.
+            const bridgeWrites = actions.filter(a =>
+                a?.type === SET_PROJECTIONS_CONFIG
+                && a?.config?.customResolutions === pluginCfgCustomResolutions
+            );
+            expect(bridgeWrites.length).toBe(0);
+            done();
+        }, 0);
+    });
 });

web/client/plugins/CRSSelector/containers/CRSSelector.jsx

@@ -6,9 +6,9 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { has, includes, indexOf } from 'lodash';
+import { has, includes, indexOf, isEmpty } from 'lodash';
 import PropTypes from 'prop-types';
-import React, { useMemo, useState, lazy, Suspense } from 'react';
+import React, { useEffect, useMemo, useState, lazy, Suspense } from 'react';
 import { Dropdown, FormControl, Glyphicon } from 'react-bootstrap';
 import { connect } from '../../../utils/PluginsUtils';
 import { createSelector } from 'reselect';
@@ -105,7 +105,8 @@ const Selector = ({
     currentBackground,
     onError = () => {},
     canEditProjection = true,
-    unregisteredProjections = []
+    unregisteredProjections = [],
+    customResolutions
 }) => {
     const [toggled, setToggled] = useState(false);
     const [openAvailableProjections, setOpenAvailableProjections] = useState(false);
@@ -116,6 +117,18 @@ const Selector = ({
         }
     }, toggled);
 
+    // Make the configured `customResolutions` available to the rest of the
+    // plugin so that, when the user switches CRS or saves the map, the correct
+    // per-CRS resolutions are applied and persisted.
+    useEffect(() => {
+        if (
+            !isEmpty(customResolutions)
+            && isEmpty(projectionsConfig?.customResolutions)
+        ) {
+            setConfig({ ...projectionsConfig, customResolutions });
+        }
+    }, [customResolutions, projectionsConfig?.customResolutions]);
+
     const changeCrs = (crs) => {
         const allowedLayerTypes = ["wms", "osm", "tileprovider", "terrain", "empty"];
         if (indexOf(allowedLayerTypes, currentBackground?.type) > -1
@@ -311,7 +324,8 @@ Selector.propTypes = {
     projectionsConfig: PropTypes.object,
     setConfig: PropTypes.func,
     canEditProjection: PropTypes.bool,
-    searchResultsRemote: PropTypes.array
+    searchResultsRemote: PropTypes.array,
+    customResolutions: PropTypes.object
 };
 
 const CRSSelector = connect(