--- a/client/src/components/fairway/Fairwayprofile.vue	Thu Feb 21 10:46:38 2019 +0100
+++ b/client/src/components/fairway/Fairwayprofile.vue	Thu Feb 21 12:21:42 2019 +0100
@@ -154,18 +154,11 @@
       return this.currentProfile[this.additionalSurvey.date_info].points;
     },
     waterColor() {
-      const result = this.waterLevels.find(
-        x => x.level === this.selectedWaterLevel
-      );
-      return result.color;
+      return "#005DFF";
     },
     xScale() {
       return [0, this.totalLength];
     },
-    yScaleLeft() {
-      const hi = Math.max(this.maxAlt, this.selectedWaterLevel);
-      return [this.minAlt, hi];
-    },
     yScaleRight() {
       const DELTA = this.maxAlt * 1.1 - this.maxAlt;
       return [this.maxAlt * 1 + DELTA, -DELTA];
@@ -296,10 +289,6 @@
         .rangeRound([0, width]);
 
       xScale.ticks(5);
-      let yScaleLeft = d3
-        .scaleLinear()
-        .domain(this.yScaleLeft)
-        .rangeRound([height, 0]);
 
       let yScaleRight = d3
         .scaleLinear()
@@ -322,7 +311,7 @@
         .append("g")
         .attr("transform", "translate(" + width + ",0)")
         .call(yAxis2);
-      return { xScale, yScaleLeft, yScaleRight, graph };
+      return { xScale, yScaleRight, graph };
     },
     drawWaterlevel({ graph, xScale, yScaleRight, height }) {
       let waterArea = d3

--- a/client/src/store/fairway.js	Thu Feb 21 10:46:38 2019 +0100
+++ b/client/src/store/fairway.js	Thu Feb 21 12:21:42 2019 +0100
@@ -22,8 +22,6 @@
 import { featureToFairwayCoordinates } from "../lib/geo.js";
 import { LAYERS } from "@/store/map.js";
 
-const DEMOLEVEL = 149.345;
-
 // initial state
 const init = () => {
   return {
@@ -31,8 +29,8 @@
     minAlt: 0,
     maxAlt: 0,
     currentProfile: {},
-    waterLevels: [{ year: "2016", level: DEMOLEVEL, color: "#005DFF" }],
-    selectedWaterLevel: DEMOLEVEL,
+    waterLevels: {},
+    selectedWaterLevel: "",
     fairwayData: [],
     startPoint: null,
     endPoint: null,
@@ -67,6 +65,8 @@
     profileLoaded: (state, answer) => {
       const { response, surveyDate } = answer;
       const { data } = response;
+      const { waterlevel } = response.data.properties;
+      const { value, when } = waterlevel;
       const coordinates = data.geometry.coordinates;
       if (!coordinates) return;
       const startPoint = state.startPoint;
@@ -75,6 +75,8 @@
       const result = prepareProfile({ geoJSON, startPoint, endPoint });
       // Use Vue.set() to make new object properties rective
       // https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats
+      Vue.set(state.waterLevels, when, { value });
+      if (state.selectedWaterLevel === "") state.selectedWaterLevel = when;
       Vue.set(state.currentProfile, surveyDate, {
         points: result.points,
         length: result.lengthPolyLine