Remove left, right, and top margins

assets/src/scripts/components/hydrograph/axes.js

@@ -87,7 +87,7 @@ function appendAxes(elem, {xAxis, yAxis, layout, yTitle}) {
     const yLoc = {x: 0, y: 0};
     const yLabelLoc = {
         x: layout.height / -2 + MARGIN.top,
-        y: -35
+        y: -40
     };
 
     // Remove existing axes before adding the new ones.

assets/src/scripts/components/hydrograph/cursor.js

@@ -117,7 +117,7 @@ const cursorSlider = function (elem) {
                         .classed('active', cursorOffset !== null);
                 }, cursorOffsetSelector))
                 .call(link((input, layout) => {
-                    input.style('width', layout.width - MARGIN.right + SLIDER_OFFSET_PX * 2 + 'px');
+                    input.style('width', layout.width - (MARGIN.left + MARGIN.right) + SLIDER_OFFSET_PX * 2 + 'px');
                 }, layoutSelector));
         });
 };

assets/src/scripts/components/hydrograph/index.js

@@ -289,7 +289,7 @@ const timeSeriesGraph = function (elem) {
         .attr('class', 'hydrograph-container')
         .call(createTitle)
         .append('svg')
-            .call(link((elem, layout) => elem.attr('viewBox', `0 0 ${layout.width} ${layout.height}`), layoutSelector))
+            .call(link((elem, layout) => elem.attr('viewBox', `0 0 ${layout.width + MARGIN.left + MARGIN.right} ${layout.height + MARGIN.top + MARGIN.bottom}`), layoutSelector))
             .call(link(addSVGAccessibility, createStructuredSelector({
                 titleSelector,
                 descriptionSelector,

assets/src/scripts/components/hydrograph/layout.js

@@ -5,10 +5,10 @@ const { createSelector } = require('reselect');
 const ASPECT_RATIO = 1 / 2;
 const ASPECT_RATIO_PERCENT = `${100 * ASPECT_RATIO}%`;
 const MARGIN = {
-    top: 40,
-    right: 75,
-    bottom: 40,
-    left: 50
+    top: 0,
+    right: 0,
+    bottom: 20,
+    left: 75
 };
 const CIRCLE_RADIUS = 4;
 const CIRCLE_RADIUS_SINGLE_PT = 1;