From 9b91860fdf7ae133b28d8ec23920b05c29418521 Mon Sep 17 00:00:00 2001 From: Frederic Junod Date: Wed, 12 Jul 2023 11:28:15 +0200 Subject: [PATCH] BGDIINF_SB-3007: Set camera to null if undefined --- .../map/components/cesium/CesiumMap.vue | 31 ++++++++++++------- .../storeSync/CameraParamConfig.class.js | 2 +- src/store/modules/position.store.js | 20 ++---------- src/store/plugins/sync-camera-lonlatzoom.js | 2 +- .../integration/3d/transitionTo3d.cy.js | 2 +- 5 files changed, 24 insertions(+), 33 deletions(-) diff --git a/src/modules/map/components/cesium/CesiumMap.vue b/src/modules/map/components/cesium/CesiumMap.vue index a17f9dc5a..1c316991e 100644 --- a/src/modules/map/components/cesium/CesiumMap.vue +++ b/src/modules/map/components/cesium/CesiumMap.vue @@ -70,13 +70,11 @@ export default { computed: { ...mapState({ zoom: (state) => state.position.zoom, - rotation: (state) => state.position.rotation, - center: (state) => state.position.center, - is3DActive: (state) => state.ui.showIn3d, + camera: (state) => state.position.camera, uiMode: (state) => state.ui.mode, previewYear: (state) => state.layers.previewYear, }), - ...mapGetters(['centerEpsg4326', 'resolution', 'hasDevSiteWarning', 'visibleLayers']), + ...mapGetters(['centerEpsg4326', 'hasDevSiteWarning', 'visibleLayers']), isDesktopMode() { return this.uiMode === UIModes.DESKTOP }, @@ -156,18 +154,27 @@ export default { this.flyToPosition() }, + unmounted() { + this.setCameraPosition(null) + this.viewer.destroy() + delete this.viewer + }, methods: { ...mapActions(['setCameraPosition']), flyToPosition() { - const cameraHeight = - (this.resolution * this.viewer.canvas.clientWidth) / - (2 * Math.tan(this.viewer.camera.frustum.fov / 2)) + const x = this.camera ? this.camera.x : this.centerEpsg4326[0] + const y = this.camera ? this.camera.y : this.centerEpsg4326[1] + const z = this.camera ? this.camera.z : 20000 // FIXME: convert this.zoom to z + const heading = CesiumMath.toRadians(this.camera ? this.camera.heading : 0) + const pitch = CesiumMath.toRadians(this.camera ? this.camera.pitch :-90) + const roll = CesiumMath.toRadians(this.camera ? this.camera.roll : 0) this.viewer.camera.flyTo({ - destination: Cartesian3.fromDegrees( - this.centerEpsg4326[0], - this.centerEpsg4326[1], - cameraHeight - ), + destination: Cartesian3.fromDegrees(x, y, z), + orientation: { + heading, + pitch, + roll, + }, duration: 0, }) }, diff --git a/src/router/storeSync/CameraParamConfig.class.js b/src/router/storeSync/CameraParamConfig.class.js index 93e3baae4..22cb34fdf 100644 --- a/src/router/storeSync/CameraParamConfig.class.js +++ b/src/router/storeSync/CameraParamConfig.class.js @@ -38,7 +38,7 @@ function dispatchCameraFromUrlIntoStore(store, urlParamValue) { } function generateCameraUrlParamFromStoreValues(store) { - if (store.state.ui.showIn3d) { + if (store.state.ui.showIn3d && store.state.position.camera !== null) { const { x, y, z, pitch, heading, roll } = store.state.position.camera const valuesAsString = [x, y, z, pitch, heading, roll].map((value) => value === 0 ? '' : `${value}` diff --git a/src/store/modules/position.store.js b/src/store/modules/position.store.js index f06812ecb..8effc811d 100644 --- a/src/store/modules/position.store.js +++ b/src/store/modules/position.store.js @@ -78,14 +78,7 @@ const state = { * * @type CameraPosition */ - camera: { - x: 0, - y: 0, - z: 0, - heading: 0, - pitch: 0, - roll: 0, - }, + camera: null, } /** @@ -289,16 +282,7 @@ const actions = { * @param {CameraPosition} cameraPosition */ setCameraPosition({ commit }, cameraPosition) { - // defaulting to 0 if the camera position is lacking some properties - const curatedCameraPosition = Object.assign({ - x: 0, - y: 0, - z: 0, - heading: 0, - pitch: 0, - roll: 0, - }, cameraPosition) - commit('setCameraPosition', curatedCameraPosition) + commit('setCameraPosition', cameraPosition) }, } diff --git a/src/store/plugins/sync-camera-lonlatzoom.js b/src/store/plugins/sync-camera-lonlatzoom.js index 4837ece22..ef21850ec 100644 --- a/src/store/plugins/sync-camera-lonlatzoom.js +++ b/src/store/plugins/sync-camera-lonlatzoom.js @@ -5,7 +5,7 @@ */ export default function syncCameraLonLatZoom(store) { store.subscribe((mutation, state) => { - if (mutation.type === 'setCameraPosition') { + if (mutation.type === 'setCameraPosition' && state.position.camera !== null) { store.dispatch('setLongitude', parseFloat(state.position.camera.x)) store.dispatch('setLatitude', parseFloat(state.position.camera.y)) // FIXME: store.dispatch('setZoom', something(state.position.camera.z)) diff --git a/tests/e2e-cypress/integration/3d/transitionTo3d.cy.js b/tests/e2e-cypress/integration/3d/transitionTo3d.cy.js index 9ec51fa63..570f69b10 100644 --- a/tests/e2e-cypress/integration/3d/transitionTo3d.cy.js +++ b/tests/e2e-cypress/integration/3d/transitionTo3d.cy.js @@ -64,7 +64,7 @@ describe('Testing transitioning between 2D and 3D', () => { cy.get('[data-cy="3d-button"]').click() cy.readWindowValue('cesiumViewer').then((viewer) => { const cameraPosition = viewer.camera.positionCartographic - expect(cameraPosition.longitude).to.eq(0.13147292983909972) + expect(cameraPosition.longitude).to.eq(0.13147292983909975) expect(cameraPosition.latitude).to.eq(0.819968266410843) expect(cameraPosition.height).to.eq(36434.03514736528) })