ContEx Charts

About ContEx Charts

What is ContEx?

A pure Elixir server-side data plotting library outputting SVG.

Why did you write it?

For a couple of reasons:

  • I had a lot of dashboard & data visualisation work coming up and although I could generate nice charts using Javascript libraries, it's fiddly and involves quite a lot of boilerplate.
  • I have benefitted immensely from the open source community and decided that this could be a reasonable gift back to the community as a way of saying thanks. I know from reading the forums etc that there is a need for something like this

What are the main limitations?

  • It's early days, so the API is going to change and that might break any code that relies on it.
  • Interacting with the graphics (for example, brushing) isn't possible without a lot of JS. If you need highly interactive graphics, use a JS charting library
  • Some browsers (notably iOS-based) don't pick up clicks from SVG elements, so if you rely on this and have no control over the end user's browser, you may want to use something else
  • There's no state management in the chart generation at this point, so no smarts to send incremental diffs to the browser as a dataset changes. This may be reconsidered when Phoenix LiveView has better handling of changes to lists, although it is quite complex when it comes to managing and adjusting axes as data change.

What's on the roadmap?

In no particular order, but likely dependent on the immediate needs of a startup I'm co-founding:

  • Line plots
  • Plot overlays
  • Dataset -> Stats transformation (e.g. for generating histograms, Q-Q plots, CuSum plots)
  • Colour interpolation system in order to create...
  • Continuous colour scales
  • Size / area scales
  • Nicer option handling

In addition, there are some significant house-keeping items to attend to:

  • Better test coverage (i.e. some). Because it highly graphical and mostly developed interactively with a suite of LiveView's to check output it probably isn't as important as for other library types, but it would be good to get solid coverage of Axis/Scale logic, Dataset aggregation/stats


Because the codebase is still evolving rapidly, and some areas will be tidied up as the API and functionality evolve, it isn't practical yet to handle unplanned PRs. If you have something in mind, it is better to raise an issue on github first to discuss what you have in mind.

I don't have any plans for this project to be a one man band, and over time, if there's interest, I'd be very happy to have multiple maintainers looking after the codebase.

What other options do I have as an Elixir Developer?

PlotEx: Another pure Elixir option. More optimized for line charts with large datasets, and time series

DIY Server Side: There are a few examples around showing generating SVG server side

Elixir wraps for JS libraries: For example, chartkick-ex - a chartkick.js wrapper

LiveView interop with a JS charting library: For example Highcharts with LiveView hooks

Who is MindOk?

Many years ago I was told by a very wise man "Mind Ok, Everything Ok". It is so true. I have encountered poor, sick people who are happy, and rich, healthy, miserable folk. Wealth, fame etc count for nothing if you're miserable. Mind and the way it views the world are the most important thing. "MindOk" is there to remind me every day.