Over the last few years we’ve had a number of projects that required some pretty heavy lifting in the visualisation department.
One of our ‘go to’ packages is Plotly. It offers some pretty awesome tools for developers to produce all sorts of plots and visualisations. From scatter to sankey, scientific to financial – Plotly seems to do it all.
So why Grafl?
Here at Cursive, we felt that all this plotting goodness could be made more accessible to a wider audience, and not just aimed Python or JavaScript developers.
So that’s how Grafl.io was born, with the aim creating great looking and functional interactive charts, graphs and plots with ease. It’s a simple concept really, if you want to turn data into a graph or visualisation, Grafl can help.
Plots are defined using simple JSON format so you can get started quickly. With ~70 different types to choose from, you’ll have the power and flexibility to generate some amazing interactive visualisations.
Take the hard work out of visualizing your data
Getting started
There are a few different ways of using Grafl. If you need a one off plot – say for a presentation, a social media post or to add to an email, you can design your plot using the Grafl editor which generates a unique self-contained Grafl URL, with all plot parameters and data included. By changing a few lines of code in the editor, it’s possible to generate SVG or PNG representations of the plots, that can be downloaded.
But it gets better... for live, dynamic plots, you can post data to the service and receive a self contained plot embedded into your website. This means your plot will automatically update as your data changes.
For fellow Wagtail lovers, we’ve built a Wagtail integration called wagtail-grafl. This is our first integration for Grafl but it won’t be the last.
The Grafl website comes with a whole bunch of example plots (about 70 so far) that can be used as a starting point for your own creations. It’s as easy as pie!
Basic plots
Bar, Bubble, Dot, Icicle, Line, Pie, Scatter, Sankey, Sunburst, Treemap
Statistical
Box, Error Bars, Histogram, Histogram 2D, Histogram 2D Contour, Parallel Categories, Scatterplot Matrix (Splom), Violin
Scientific
Barpolar, Carpet, Contour, Heatmap, Parallel Coordinates, Scatter Polar, Scatter Smith, Scatter Ternary
Everybody loves a Sankey diagram
There is something about Sankey diagrams that makes them pleasing to the eye. With Grafl, the world of Sankey diagrams, as well as many other visualisations, are made available in a few lines of config. You can even make them interactive so you can reorganise the data points. Give it a whirl!
{
"figure": {
"plots": [
{
"traces": [
{
"data": {
"type": "sankey",
"node": {
"label": [
"In1", "In2", "Process1",
"Process2", "Out1", "Out2"]
},
"link": {
"color": "rgba(200, 200, 200, 0.5)",
"source": [0, 1, 0, 2, 3, 3, 1, 2],
"target": [2, 3, 3, 4, 4, 5, 2, 5],
"value": [3, 1, 2, 3, 1, 2, 2, 2]
}
}
}
]
}
]
}
}The Grafl API can be used directly to generate plots in your browser in real time which means you can include them in emails, documents and presentations. This example Sankey diagram is generated by sending the plot parameters to Grafl. The Grafl service processes the order, draws the graph and sends it back to the website fully-formed in the blink of an eye.
Financial
Funnel, Funnel Area, Candlestick, OHLC (open, high, low and close), Waterfall
Maps
Choropleth, Choropleth Mapbox, Scatter Geo, Scatter Mapbox
3D
Cone, Mesh 3D, Scatter 3D, Streamtube, Surface
Grafl in action
We put Grafl to the test when we made a new website for a company specialising in video effects for the film and television industry.
As part of their B Corp accreditation they have a requirement to publish their carbon emission data, amongst other things.
Grafl allows their content team to quickly and easily publish their data online and in-keeping with their brand. Grafl puts them fully in control of how their data is presented. Their website, their data, their house style.
Plot showing cumulative carbon emissions by Scope per month.
Interactive plots and maps
Creating interactive plots, like this choropleth map showing world population by country, is really easy.
Want to know more?
If you’d like to know more about what Grafl has to offer, or you’re interested in setting up your own Grafl service please get in touch.
