#9464: fix issue of not showing background layer in case of switching from 2D mode to 3D mode

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

@@ -22,6 +22,13 @@ This is a list of things to check if you want to update from a previous version
 
 ## Migration from 2023.02.xx to 2024.01.00
 
+### Fixing background config
+
+From this version in order to fix default 3d background config a change is needed here:
+
+- update `localConfig.json` by adding **visibility: false**  to the Empty Background entry in intialState.defaultState.catalog.default.staticServices.default_map_backgrounds.backgrounds.
+- update `new.json` by adding **visibility: false**  to the Empty Background entry.
+
 ### Adding spatial filter to dashboard widgets
 
 In order to enable the possibility to add in and the spatial filter to the widgets ( see [#9098](https://github.com/geosolutions-it/MapStore2/issues/9098) ) you have to edit the `QueryPanel` config in the `plugins.dashboard` array of the `localConfig.json` file by adding:

web/client/components/map/cesium/Layer.jsx

@@ -167,7 +167,7 @@ class CesiumLayer extends React.Component {
                 return false;
             }
         }
-        return visibility !== false;
+        return visibility;
     };
 
     setLayerOpacity = (opacity) => {

web/client/components/map/cesium/__tests__/Layer-test.jsx

@@ -98,7 +98,9 @@ describe('Cesium layer', () => {
     });
 
     it('creates a osm layer for cesium map', () => {
-        var options = {};
+        var options = {
+            visibility: true
+        };
         // create layers
         var layer = ReactDOM.render(
             <CesiumLayer type="osm"
@@ -113,7 +115,8 @@ describe('Cesium layer', () => {
             "source": "osm",
             "title": "Open Street Map",
             "name": "mapnik",
-            "group": "background"
+            "group": "background",
+            "visibility": true
         };
         // create layer
         var layer = ReactDOM.render(
@@ -455,7 +458,8 @@ describe('Cesium layer', () => {
             "title": "Bing Aerial",
             "name": "Aerial",
             "group": "background",
-            "apiKey": "required"
+            "apiKey": "required",
+            "visibility": true
         };
         // create layers
         var layer = ReactDOM.render(
@@ -472,7 +476,7 @@ describe('Cesium layer', () => {
                 options={{}} position={0} map={map}/>, document.getElementById("container"));
 
         expect(layer).toExist();
-        expect(map.imageryLayers.length).toBe(1);
+        expect(map.imageryLayers.length).toBe(0);
         // not visibile layers are removed from the leaflet maps
         layer = ReactDOM.render(
             <CesiumLayer type="osm"

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

@@ -440,9 +440,9 @@ describe('CesiumMap', () => {
         act(() => {
             ReactDOM.render(
                 <CesiumMap ref={value => { ref = value; } } id="mymap" center={{ y: 43.9, x: 10.3 }} zoom={11}>
-                    <CesiumLayer type="wms" position={1} options={{ url: '/wms', name: 'layer01' }} />
-                    <CesiumLayer type="wms" position={3} options={{ url: '/wms', name: 'layer02' }} />
-                    <CesiumLayer type="wms" position={6} options={{ url: '/wms', name: 'layer03' }} />
+                    <CesiumLayer type="wms" position={1} options={{ url: '/wms', name: 'layer01', "visibility": true }} />
+                    <CesiumLayer type="wms" position={3} options={{ url: '/wms', name: 'layer02', "visibility": true }} />
+                    <CesiumLayer type="wms" position={6} options={{ url: '/wms', name: 'layer03', "visibility": true }} />
                 </CesiumMap>,
                 document.getElementById('container')
             );
@@ -455,9 +455,9 @@ describe('CesiumMap', () => {
         act(() => {
             ReactDOM.render(
                 <CesiumMap ref={value => { ref = value; } } id="mymap" center={{ y: 43.9, x: 10.3 }} zoom={11}>
-                    <CesiumLayer type="wms" position={1} options={{ url: '/wms', name: 'layer01' }} />
-                    <CesiumLayer type="wms" position={3} options={{ url: '/wms', name: 'layer02' }} />
-                    <CesiumLayer type="wms" position={4} options={{ url: '/wms', name: 'layer03' }} />
+                    <CesiumLayer type="wms" position={1} options={{ url: '/wms', name: 'layer01', "visibility": true }} />
+                    <CesiumLayer type="wms" position={3} options={{ url: '/wms', name: 'layer02', "visibility": true }} />
+                    <CesiumLayer type="wms" position={4} options={{ url: '/wms', name: 'layer03', "visibility": true }} />
                 </CesiumMap>,
                 document.getElementById('container')
             );
@@ -468,9 +468,9 @@ describe('CesiumMap', () => {
         act(() => {
             ReactDOM.render(
                 <CesiumMap ref={value => { ref = value; } } id="mymap" center={{ y: 43.9, x: 10.3 }} zoom={11}>
-                    <CesiumLayer type="wms" position={1} options={{ url: '/wms', name: 'layer01' }} />
-                    <CesiumLayer type="wms" position={3} options={{ url: '/wms', name: 'layer02' }} />
-                    <CesiumLayer type="wms" position={2} options={{ url: '/wms', name: 'layer03' }} />
+                    <CesiumLayer type="wms" position={1} options={{ url: '/wms', name: 'layer01', "visibility": true }} />
+                    <CesiumLayer type="wms" position={3} options={{ url: '/wms', name: 'layer02', "visibility": true }} />
+                    <CesiumLayer type="wms" position={2} options={{ url: '/wms', name: 'layer03', "visibility": true }} />
                 </CesiumMap>,
                 document.getElementById('container')
             );

web/client/configs/localConfig.json

@@ -215,7 +215,8 @@
 						"group": "background",
 						"title": "Empty Background",
 						"fixed": true,
-						"type": "empty"
+						"type": "empty",
+						"visibility": false
 					}
 				]
 			  }

web/client/configs/new.json

@@ -123,7 +123,8 @@
                 "group": "background",
                 "title": "Empty Background",
                 "fixed": true,
-                "type": "empty"
+                "type": "empty",
+                "visibility": false
             }
         ]
 	}