Mercurial > gemma

changeset 1313:e4e35fb2d995

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
save map extent (center/zoom) in store, to not lose it when switching between map and admin area
author Markus Kottlaender <markus@intevation.de>
date Fri, 23 Nov 2018 15:18:14 +0100
parents 3c37017f5eb8
children 97d9e689520b
files client/src/components/map/Main.vue client/src/components/map/Maplayer.vue client/src/components/map/fairway/Fairwayprofile.vue client/src/store/map.js
diffstat 4 files changed, 22 insertions(+), 11 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/map/Main.vue	Fri Nov 23 13:57:31 2018 +0100
+++ b/client/src/components/map/Main.vue	Fri Nov 23 15:18:14 2018 +0100
@@ -1,6 +1,6 @@
 <template>
     <div class="main d-flex flex-column">
-        <Maplayer :split="showSplitscreen" :lat="6155376" :long="1819178" :zoom="11"></Maplayer>
+        <Maplayer :split="showSplitscreen"></Maplayer>
         <FairwayProfile
             :additionalSurveys="additionalSurveys"
             :xScale="xAxis"
--- a/client/src/components/map/Maplayer.vue	Fri Nov 23 13:57:31 2018 +0100
+++ b/client/src/components/map/Maplayer.vue	Fri Nov 23 15:18:14 2018 +0100
@@ -50,7 +50,7 @@
 /* eslint-disable no-console */
 export default {
   name: "maplayer",
-  props: ["lat", "long", "zoom", "split"],
+  props: ["split"],
   data() {
     return {
       projection: "EPSG:3857"
@@ -59,6 +59,7 @@
   computed: {
     ...mapGetters("map", ["getLayerByName"]),
     ...mapState("map", [
+      "extent",
       "layers",
       "openLayersMap",
       "lineTool",
@@ -261,11 +262,19 @@
       target: "map",
       controls: [],
       view: new View({
-        center: [this.long, this.lat],
-        zoom: this.zoom,
+        center: [this.extent.lon, this.extent.lat],
+        zoom: this.extent.zoom,
         projection: this.projection
       })
     });
+    map.on("moveend", event => {
+      const center = event.map.getView().getCenter();
+      this.$store.commit("map/extent", {
+        lat: center[1],
+        lon: center[0],
+        zoom: event.map.getView().getZoom()
+      });
+    });
     this.$store.dispatch("map/openLayersMap", map);
 
     // TODO make display of layers more dynamic, e.g. from a list
--- a/client/src/components/map/fairway/Fairwayprofile.vue	Fri Nov 23 13:57:31 2018 +0100
+++ b/client/src/components/map/fairway/Fairwayprofile.vue	Fri Nov 23 15:18:14 2018 +0100
@@ -161,13 +161,7 @@
 
 export default {
   name: "fairwayprofile",
-  props: [
-    "xScale",
-    "yScaleLeft",
-    "yScaleRight",
-    "margin",
-    "additionalSurveys"
-  ],
+  props: ["xScale", "yScaleLeft", "yScaleRight", "margin", "additionalSurveys"],
   data() {
     return {
       wait: false,
--- a/client/src/store/map.js	Fri Nov 23 13:57:31 2018 +0100
+++ b/client/src/store/map.js	Fri Nov 23 15:18:14 2018 +0100
@@ -31,6 +31,11 @@
 const init = () => {
   return {
     openLayersMap: null,
+    extent: {
+      lat: 6155376,
+      lon: 1819178,
+      zoom: 11
+    },
     identifiedFeatures: [], // map features identified by clicking on the map
     currentMeasurement: null, // distance or area from line-/polygon-/cutTool
     lineTool: null, // open layers interaction object (Draw)
@@ -347,6 +352,9 @@
     }
   },
   mutations: {
+    extent: (state, extent) => {
+      state.extent = extent;
+    },
     toggleVisibility: (state, layer) => {
       state.layers[layer].isVisible = !state.layers[layer].isVisible;
       state.layers[layer].data.setVisible(state.layers[layer].isVisible);