Elm Data Visualisation

This little talk was about creating Data Visualisations using Elm and fairly low-level-yet-still-pleasant-in-Elm SVG primatives. Shows how to animate transitions, respond to input, draw based on data and more.

The core idea is that Elm (or React) + low level SVG stuff gets you a long way, particularly in creating bespoke/fairly customised data visualisations. But, frankly, is a a difficult case to make: just by using a bit of maths we lose a lot of the audience and the lack of quick results makes for a less compelling demo. I tried to show two key areas where this approach works really well: complex tranistion state and how easy it is to layer on customisations. I should probably have gone with the: look how easy it is to create an entire type-safe presentation in Elm (as I actually ended up doing that just to present the data stuff).

Slides

The slides (themselves an interactive Elm demo)

Navigate with right/left arrow keys, Esc to go back to start, return to fast forward and C to show code associated with slides when available.

Notes

Source Code

While the presentation itself includes selected source the complete code is available. I attempted to give clear yet sufficiently sophisticated/realistic examples to be interesting.

Notes on talks from James Porter