changeset 2206:2e64d1be3dbc pdf-export

staging: zoomable stretches. zoomToExtent etd
author Thomas Junk <thomas.junk@intevation.de>
date Tue, 05 Feb 2019 16:50:59 +0100
parents 59c21dee6315
children da902f0dac88
files client/src/components/staging/StagingDetail.vue client/src/store/map.js
diffstat 2 files changed, 8 insertions(+), 5 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/staging/StagingDetail.vue	Tue Feb 05 16:33:01 2019 +0100
+++ b/client/src/components/staging/StagingDetail.vue	Tue Feb 05 16:50:59 2019 +0100
@@ -212,8 +212,7 @@
         .then(response => {
           if (response.data.features.length < 1)
             throw new Error("no feaures found for: " + name);
-          const { coordinates } = center(response.data.features[0]).geometry;
-          this.moveMap(coordinates);
+          this.moveToExtent(response.data.features[0]);
         })
         .catch(error => {
           console.log(error);
@@ -306,9 +305,9 @@
       const { coordinates } = center(this.bottlenecks[index]).geometry;
       this.moveMap(coordinates);
     },
-    moveToExtent(geometry) {
+    moveToExtent(feature) {
       this.$store.commit("map/moveToExtent", {
-        extent: geometry,
+        feature: feature,
         zoom: 17,
         preventZoomOut: true
       });
--- a/client/src/store/map.js	Tue Feb 05 16:33:01 2019 +0100
+++ b/client/src/store/map.js	Tue Feb 05 16:50:59 2019 +0100
@@ -29,6 +29,8 @@
 import { getLength, getArea } from "ol/sphere.js";
 import { unByKey } from "ol/Observable";
 import { getCenter } from "ol/extent";
+import { transformExtent } from "ol/proj.js";
+import bbox from "@turf/bbox";
 import app from "../main";
 
 // initial state
@@ -394,7 +396,9 @@
     cutTool: (state, cutTool) => {
       state.cutTool = cutTool;
     },
-    moveToExtent: (state, { extent, zoom, preventZoomOut }) => {
+    moveToExtent: (state, { feature, zoom, preventZoomOut }) => {
+      const boundingBox = bbox(feature.geometry);
+      const extent = transformExtent(boundingBox, "EPSG:4326", "EPSG:3857");
       let view = state.openLayersMap.getView();
       const currentZoom = view.getZoom();
       view.fit(extent, {