Merge branch 'master' into elevation-multi-dataset

Author: NullSeile

components/map3d/Compare3D.jsx

@@ -144,6 +144,7 @@ class Compare3D extends React.Component {
 
         const renderer = this.props.sceneContext.scene.renderer;
         renderer.domElement.addEventListener("pointerdown", this.dragArrows);
+        this.centerArrowsInView();
     };
     disableArrows = () => {
         this.props.sceneContext.scene.view.controls?.removeEventListener?.('change', this.centerArrowsInView);

components/map3d/Map3D.jsx

@@ -221,6 +221,11 @@ class Map3D extends React.Component {
         }
     };
     setBaseLayer = (layer, visibility) => {
+        const currentBaseLayer = this.state.sceneContext.baseLayers.find(l => l.visibility === true)?.name || "";
+        if (visibility && layer?.name === currentBaseLayer) {
+            // Nothing changed
+            return;
+        }
         this.setState(state => ({
             sceneContext: {
                 ...state.sceneContext,
@@ -978,6 +983,7 @@ class Map3D extends React.Component {
                 resolve({
                     objects: objects,
                     colorLayers: layers,
+                    baseLayer: this.state.sceneContext.baseLayers.find(layer => layer.visibility === true)?.name || "",
                     personHeight: this.state.sceneContext.scene.view.controls.personHeight ?? 0,
                     camera: [camera.x, camera.y, camera.z],
                     target: [target.x, target.y, target.z]
@@ -1014,14 +1020,14 @@ class Map3D extends React.Component {
             }
         });
         this.state.sceneContext.restoreView(data);
-        if (data.baselayer !== undefined) {
+        if (data.baseLayer !== undefined) {
             this.setState(state => ({
                 sceneContext: {
                     ...state.sceneContext,
-                    baseLayers: state.sceneContext.baseLayers.map(l => ({...l, visibility: l.name === data.baselayer}))
+                    baseLayers: state.sceneContext.baseLayers.map(l => ({...l, visibility: l.name === data.baseLayer}))
                 }
             }));
-            UrlParams.updateParams({bl3d: data.baselayer});
+            UrlParams.updateParams({bl3d: data.baseLayer});
         }
         this.state.sceneContext.scene.notifyChange();
     };

components/map3d/MapControls3D.jsx

@@ -175,19 +175,28 @@ class MapControls3D extends React.Component {
     setViewToExtent = (bounds, angle = 0) => {
         this.leaveFirstPerson();
 
-        const center = {
-            x: 0.5 * (bounds[0] + bounds[2]),
-            y: 0.5 * (bounds[1] + bounds[3])
-        };
-        center.z = this.props.sceneContext.getTerrainHeightFromMap([center.x, center.y]) ?? 0;
-
-        // Camera height to width bbox width
         const fov = CAMERA_FOV / 180 * Math.PI;
         const cameraHeight = (bounds[2] - bounds[0]) / (2 * Math.tan(fov / 2));
 
-        const camerapos = new Vector3(center.x, center.y, center.z + cameraHeight);
-        const target = new Vector3(center.x, center.y, center.z);
-        this.controls.animateTo(camerapos, target, angle);
+        const center = {
+            x: 0.5 * (bounds[0] + bounds[2]),
+            y: 0.5 * (bounds[1] + bounds[3]),
+        };
+        const camerapos = new Vector3(center.x, center.y, cameraHeight);
+        const target = new Vector3(center.x, center.y, 0);
+        const h = this.props.sceneContext.getTerrainHeightFromMap([center.x, center.y]);
+        // Fall back to getTerrainHeightFromDTM if map is not yet loaded
+        if (h === undefined) {
+            this.props.sceneContext.getTerrainHeightFromDTM([center.x, center.y]).then(h2 =>  {
+                camerapos.z += h2;
+                target.z += h2;
+                this.controls.animateTo(camerapos, target, angle);
+            })
+        } else {
+            camerapos.z += h;
+            target.z += h;
+            this.controls.animateTo(camerapos, target, angle);
+        }
     };
     pan = (ev, dx, dy) => {
         const panInterval = setInterval(() => {

plugins/View3D.jsx

@@ -9,6 +9,7 @@
 import React from 'react';
 import {connect, Provider} from 'react-redux';
 
+import isEmpty from 'lodash.isempty';
 import PropTypes from 'prop-types';
 import {createSelector} from 'reselect';
 
@@ -256,6 +257,7 @@ class View3D extends React.Component {
         } else if (this.props.view3dMode === View3DMode.DISABLING && prevProps.view3dMode !== View3DMode.DISABLING) {
             this.map3dComponentRef.store3dState().then(storedState => {
                 this.setState({storedState});
+                UrlParams.updateParams({v3d: undefined, bl3d: undefined});
                 this.props.setView3dMode(View3DMode.DISABLED);
             });
         } else if (this.props.view3dMode === View3DMode.DISABLED && prevProps.view3dMode !== View3DMode.DISABLED) {
@@ -389,8 +391,7 @@ class View3D extends React.Component {
         return [button, this.render3DWindow()];
     }
     onClose = () => {
-        this.props.setView3dMode(View3DMode.DISABLED);
-        UrlParams.updateParams({v3d: undefined});
+        this.props.setView3dMode(View3DMode.DISABLING);
     };
     onGeometryChanged = (geometry) => {
         if (geometry.maximized && this.props.view3dMode !== View3DMode.FULLSCREEN) {
@@ -462,7 +463,7 @@ class View3D extends React.Component {
     };
     setupMap = () => {
         if (this.map3dComponentRef) {
-            if (this.state.storedState) {
+            if (!isEmpty(this.state.storedState)) {
                 this.map3dComponentRef.restore3dState(this.state.storedState);
             } else {
                 this.sync2DExtent();