Mercurial > gemma

changeset 3527:8a9ee18de13f waterlevel-in-crossprofile

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
client: fairway profiles: implemented selection between depth reference waterlevel and current waterlevel
author Markus Kottlaender <markus@intevation.de>
date Wed, 29 May 2019 15:56:14 +0200
parents 320aa3b85152
children 804df080c826
files client/src/components/fairway/Fairwayprofile.vue client/src/components/fairway/Profiles.vue client/src/store/fairwayprofile.js
diffstat 3 files changed, 32 insertions(+), 17 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/components/fairway/Fairwayprofile.vue	Wed May 29 13:34:59 2019 +0200
+++ b/client/src/components/fairway/Fairwayprofile.vue	Wed May 29 15:56:14 2019 +0200
@@ -185,8 +185,13 @@
         .getFeatures()
         .find(f => f.get("objnam") === this.selectedBottleneck);
     },
-    refWaterlevels() {
-      return JSON.parse(this.bottleneck.get("reference_water_levels"));
+    waterlevel() {
+      return this.selectedWaterLevel === "ref"
+        ? this.refWaterlevel
+        : this.bottleneck.get("gm_waterlevel");
+    },
+    refWaterlevel() {
+      return this.selectedSurvey.waterlevel_value;
     }
   },
   watch: {
@@ -521,14 +526,20 @@
 
       let yScaleRight = d3
         .scaleLinear()
-        .domain([this.maxAlt * 1.1, -(this.maxAlt * 0.1)])
+        .domain([
+          this.maxAlt * 1.1 +
+            Math.abs(this.waterlevel - this.refWaterlevel) / 100,
+          -(this.maxAlt * 0.1)
+        ])
         .rangeRound([height, 0]);
 
       let yScaleLeft = d3
         .scaleLinear()
         .domain([
-          this.refWaterlevels.LDC - this.maxAlt * 100,
-          this.refWaterlevels.LDC + this.maxAlt * 0.1 * 100
+          this.waterlevel -
+            (this.maxAlt * 100 +
+              Math.abs(this.waterlevel - this.refWaterlevel)),
+          this.waterlevel + this.maxAlt * 0.1 * 100
         ])
         .rangeRound([height, 0]);
 
@@ -613,18 +624,22 @@
           .x(d => {
             return xScale(d.x);
           })
-          .y(d => {
-            return yScaleRight(d.y);
-          });
+          .y(d =>
+            yScaleRight(
+              d.y + Math.abs(this.waterlevel - this.refWaterlevel) / 100
+            )
+          );
         let profileArea = d3
           .area()
           .x(function(d) {
             return xScale(d.x);
           })
           .y0(height)
-          .y1(function(d) {
-            return yScaleRight(d.y);
-          });
+          .y1(d =>
+            yScaleRight(
+              d.y + Math.abs(this.waterlevel - this.refWaterlevel) / 100
+            )
+          );
         graph
           .append("path")
           .datum(part)
--- a/client/src/components/fairway/Profiles.vue	Wed May 29 13:34:59 2019 +0200
+++ b/client/src/components/fairway/Profiles.vue	Wed May 29 15:56:14 2019 +0200
@@ -37,7 +37,7 @@
         </select>
         <div v-if="selectedBottleneck">
           <div class="d-flex mt-2">
-            <div class="flex-fill">
+            <div class="flex-fill" style="max-width: 75px;">
               <small class="text-muted">
                 <translate>Waterlevel</translate>:
               </small>
@@ -45,11 +45,11 @@
                 v-model="selectedWaterLevel"
                 class="form-control form-control-sm small"
               >
-                <option value="LDC">
-                  <translate>LDC</translate>
+                <option value="ref">
+                  <translate>Depth Reference</translate>
                 </option>
                 <option value="current">
-                  <translate>Current</translate>
+                  <translate>Current Waterlevel</translate>
                 </option>
               </select>
             </div>
--- a/client/src/store/fairwayprofile.js	Wed May 29 13:34:59 2019 +0200
+++ b/client/src/store/fairwayprofile.js	Wed May 29 15:56:14 2019 +0200
@@ -28,7 +28,7 @@
     minAlt: 0,
     maxAlt: 0,
     currentProfile: {},
-    selectedWaterLevel: "LDC",
+    selectedWaterLevel: "ref",
     fairwayData: [],
     startPoint: null,
     endPoint: null,
@@ -106,7 +106,7 @@
       state.fairwayData = [];
       state.startPoint = null;
       state.endPoint = null;
-      state.selectedWaterLevel = "LDC";
+      state.selectedWaterLevel = "ref";
     },
     previousCuts: (state, previousCuts) => {
       state.previousCuts = previousCuts;