Mercurial > gemma
changeset 849:d63e60b868bf
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