Mercurial > gemma

changeset 849:d63e60b868bf

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
WIP Fairwayprofile
author Thomas Junk <thomas.junk@intevation.de>
date Fri, 28 Sep 2018 12:35:24 +0200
parents 22f7d33eee65
children fcb38cedc680
files client/src/application/Main.vue client/src/fairway/Fairwayprofile.vue client/src/fairway/store.js
diffstat 3 files changed, 14 insertions(+), 9 deletions(-) [+]
line wrap: on
line diff
--- a/client/src/application/Main.vue	Fri Sep 28 12:26:46 2018 +0200
+++ b/client/src/application/Main.vue	Fri Sep 28 12:35:24 2018 +0200
@@ -61,7 +61,7 @@
         Math.max(this.maxAlt, this.selectedWaterLevel) -
         this.selectedWaterLevel;
       const lo = this.selectedWaterLevel - this.minAlt;
-      return [lo, hi];
+      return [-lo, hi];
     },
     margins() {
       return this.margin;
--- a/client/src/fairway/Fairwayprofile.vue	Fri Sep 28 12:26:46 2018 +0200
+++ b/client/src/fairway/Fairwayprofile.vue	Fri Sep 28 12:35:24 2018 +0200
@@ -2,12 +2,12 @@
     <div class="profiledisplay d-flex flex-row">
         <div class="fairwayprofile">
         </div>
-        <div class="waterlevelselection d-flex flex-column">
+        <!-- <div class="waterlevelselection d-flex flex-column">
             <div class="form-check" v-for="level in waterLevels" :key="level.level">
-                <input class="form-check-input" :id="level.year" v-model="selectedWaterLevel" :value="level.level" type="radio">
+                <input class="form-check-input" :id="level.year" @change="setWaterlevel(level)" :value="level.level" type="radio">
                 <label class="form-check-label" :for="level.year">{{level.year}}</label>
             </div>
-        </div>
+        </div> -->
     </div>
 </template>
 
@@ -84,6 +84,9 @@
     }
   },
   methods: {
+    setWaterlevel(level) {
+      console.log(level);
+    },
     drawDiagram() {
       const chartDiv = document.querySelector(".fairwayprofile");
       d3.select("svg").remove();
@@ -139,13 +142,13 @@
           .x(function(d) {
             return xScale(d.x);
           })
-          .y0(0)
+          .y0(yScaleRight(0))
           .y1(function(d) {
             return yScaleRight(d.y);
           });
         graph
           .append("path")
-          .datum([{ x: startPoint, y: depth }, { x: endPoint, y: depth }])
+          .datum([{ x: startPoint, y: -depth }, { x: endPoint, y: -depth }])
           .attr("fill", "#002AFF")
           .attr("stroke-opacity", 0.65)
           .attr("fill-opacity", 0.65)
--- a/client/src/fairway/store.js	Fri Sep 28 12:26:46 2018 +0200
+++ b/client/src/fairway/store.js	Fri Sep 28 12:35:24 2018 +0200
@@ -1,6 +1,8 @@
 import { HTTP } from "../application/lib/http";
 import { prepareProfile } from "../application/lib/geo";
 
+const DEMOLEVEL = 149.345;
+
 const FairwayProfile = {
   namespaced: true,
   state: {
@@ -9,10 +11,10 @@
     maxAlt: 0,
     currentProfile: [],
     waterLevels: [
-      { year: "2016", level: 149.3, color: "#005DFF" },
-      { year: "2017", level: 148.2, color: "#639CFF" }
+      { year: "2016", level: DEMOLEVEL, color: "#005DFF" },
+      { year: "2017", level: 147.2, color: "#639CFF" }
     ],
-    selectedWaterLevel: 149.3,
+    selectedWaterLevel: DEMOLEVEL,
     fairwayCoordinates: [],
     startPoint: null,
     endPoint: null