--- a/client/src/components/fairway/AvailableFairwayDepthLNWL.vue	Wed May 22 15:03:30 2019 +0200
+++ b/client/src/components/fairway/AvailableFairwayDepthLNWL.vue	Wed May 22 15:11:58 2019 +0200
@@ -410,6 +410,15 @@
       this.drawBars();
       this.drawScaleLabel();
       this.drawScale();
+      this.drawTooltip();
+    },
+    drawTooltip() {
+      this.diagram
+        .append("text")
+        .text("banane")
+        .attr("font-size", "0.8em")
+        .attr("opacity", 0)
+        .attr("id", "tooltip");
     },
     generateDiagramContainer() {
       const diagram = d3
@@ -433,6 +442,27 @@
         .data(this.fwLNWLData.lnwl)
         .enter()
         .append("rect")
+        .on("mouseover", function() {
+          d3.select(this).attr("opacity", "0.8");
+          d3.select("#tooltip").attr("opacity", 1);
+        })
+        .on("mouseout", function() {
+          d3.select(this).attr("opacity", 1);
+          d3.select("#tooltip").attr("opacity", 0);
+        })
+        .on("mousemove", function(d) {
+          let y = d3.mouse(this)[1];
+          const dy = document
+            .querySelector(".diagram-container")
+            .getBoundingClientRect().left;
+          const value = d.percent;
+          d3.select("#tooltip")
+            .text(value)
+            .attr("y", y - 10)
+            .attr("x", d3.event.pageX - dy);
+          //d3.event.pageX gives coordinates relative to SVG
+          //dy gives offset of svg on page
+        })
         .attr("height", d => {
           return this.yScale(0) - this.yScale(d.percent);
         })

--- a/client/src/store/fairwayavailability.js	Wed May 22 15:03:30 2019 +0200
+++ b/client/src/store/fairwayavailability.js	Wed May 22 15:11:58 2019 +0200
@@ -16,6 +16,8 @@
 import {
   format,
   subYears,
+  startOfMonth,
+  endOfMonth,
   startOfYear,
   endOfYear,
   startOfQuarter,
@@ -43,7 +45,10 @@
 const getIntervallBorders = (start, end, frequency) => {
   switch (frequency) {
     case FREQUENCIES.MONTHLY:
-      return [start, end];
+      return [
+        format(startOfMonth(start), "YYYY-MM-DD"),
+        format(endOfMonth(end), "YYYY-MM-DD")
+      ];
     case FREQUENCIES.YEARLY:
       return [
         format(startOfYear(start), "YYYY-MM-DD"),