Terezka’s Elm Plot gives you a simple API for drawing charts. You choose the type of chart, give it X and Y values, and Elm Plot handles the dirty work of sizing the chart and drawing the line, points, and bars in SVG.
Charts can be customized as much as you want, or you can stick with the good looking defaults.
Examples
View.elm
plot : Model -> Dict Int Float -> Html Msg
plot model gains =
Plot.viewSeries
[ Plot.line (List.map (\{ index, gain } -> Plot.triangle (toFloat index) gain))
, Plot.line
(List.map
(\{ index } ->
let
gain =
Dict.get index gains
|> Maybe.withDefault 0
color =
if gain > 0 then
"black"
else
"red"
in
Plot.dot (Plot.viewTriangle color) (toFloat index) gain
)
)
]
model.days
Links