Adding live data visualisations

Posted by James on October 18, 2020

In a number of jobs I've had, displaying data visualisations that use editable data sources has been a challenge. Often the web team has ended up having to embed images of data visualisations. This is clunky and difficult for editors to change.

In this tutorial, we'll use Angular's D3 library to generate some data visualisation components, and we'll set up Contentful components in the back end to allows editors to add them as part of their document flow, and use real data to generate them.

Later we'll look at using Google Sheets as live data APIs, but for now we'll stick to JSON managed in the component.