# HG changeset patch
# User Markus Kottlaender <markus@intevation.de>
# Date 1552563395 -3600
# Node ID a735119e4f5cd641e078df0fc81c5c105d655a0b
# Parent  4bcb26542767be44948306c0ba7a64adac564d0a
client: waterlevel diagram: added y-axis label

diff -r 4bcb26542767 -r a735119e4f5c client/src/components/gauge/Waterlevel.vue
--- a/client/src/components/gauge/Waterlevel.vue	Thu Mar 14 11:23:42 2019 +0100
+++ b/client/src/components/gauge/Waterlevel.vue	Thu Mar 14 12:36:35 2019 +0100
@@ -89,12 +89,12 @@
         .append("svg")
         .attr("width", "100%")
         .attr("height", "100%");
-      let mainMargin = { top: 50, right: 20, bottom: 110, left: 40 },
+      let mainMargin = { top: 50, right: 20, bottom: 110, left: 80 },
         navMargin = {
           top: svgHeight - mainMargin.top - 35,
           right: 20,
           bottom: 30,
-          left: 40
+          left: 80
         },
         width = +svgWidth - mainMargin.left - mainMargin.right,
         mainHeight = +svgHeight - mainMargin.top - mainMargin.bottom,
@@ -150,7 +150,7 @@
 
       // DRAWING MAINCHART
 
-      // define visible area
+      // define visible chart area
       // everything outside this area will be hidden (clipped)
       svg
         .append("defs")
@@ -169,6 +169,11 @@
         .append("g")
         .attr("transform", `translate(0, ${mainHeight})`)
         .call(xAxis);
+      mainChart // label
+        .append("text")
+        .text(this.$gettext("Waterlevels [cm]"))
+        .attr("text-anchor", "middle")
+        .attr("transform", `translate(-45, ${mainHeight / 2}) rotate(-90)`);
       mainChart.append("g").call(yAxis);
 
       // waterlevel chart