fix scaling for time graphs

frontend/src/Main.elm

@@ -13,6 +13,8 @@ import Point exposing(Point, Pos ,decoder)
 import Svg exposing (Svg, svg, rect, circle, g, polyline)
 import Svg.Attributes as S exposing
     ( viewBox
+    , preserveAspectRatio
+    , transform
     , x, y
     , r, rx, ry
     , cx, cy
@@ -232,20 +234,26 @@ measureView fn allPoints =
                            (String.fromFloat (p.time - startTime)) ++ "," ++
                            (String.fromFloat c) ++ ", "
                        Nothing -> ""
+        maxY = String.fromFloat (List.foldr max 0 (List.filterMap fn filteredPoints))
         string = String.concat (List.map coords filteredPoints)
     in
         svg
-        [ H.style "width" (px portalWidth)
-        , viewBox ("0 0 " ++ (String.fromFloat (Point.duration allPoints)) ++ " 150")
+        [ width portalWidth
+        , height 200
+        , preserveAspectRatio "none"
+        , viewBox ("0 0 " ++
+                       (String.fromFloat (Point.duration allPoints)) ++
+                       " " ++ maxY)
         ]
         [ g
-          [ fill "none"
-          , stroke "red"
-          , strokeWidth "3"
+          [ stroke "#ee4444"
+          , strokeWidth "2"
+          , transform ("translate(0, " ++ maxY ++") scale(1, -1)")
           ]
           [
            polyline
                [ fill "none"
+               , style "vector-effect" "non-scaling-stroke"
                , S.points string
                ] []
           ]