Posts
Why Some Code Examples Are No Longer Working
creating-with-data
Some of the interactive code examples and demos in older posts on Creating With Data were originally hosted on Glitch, a platform for building and sharing li...
Saving D3.js animations as video files with WebAssembly
creating-with-data
Browsers are more powerful than ever! Non-browser software can be compiled to WebAssembly and used client-side. WebAssembly or ‘WASM’ acts as a bridge, allow...
Choropleth mapping house sale prices - Part 2. Visualisation
creating-with-data
In Part 1, I focused on readying the data for the visualisation. As far as the actual visualisation starter was concerned we got to the point of setting up t...
Choropleth mapping house sale prices - Part 1. Data Prep
creating-with-data
🗺️ If you’re looking for the dataviz, here it is. (No longer available due to Glitch shutting down, sorry) Looking at the stats, the ‘Choropleth code walkthr...
Building a Stripe data export app with Bubble
creating-with-data
Over the past few weeks I’ve been dabbling with Nocode tool Bubble.io. I’ve played with Make, Airtable, and IFTTT before, but nothing as involved as Bubble. ...
The making of Super Map World - Part 2. Core Architecture
creating-with-data
This is the 2nd post in a series about building Super Map World (SMW). SMW is a web-application featuring over 17,000 maps and map graphics. They’re free and...
The making of Super Map World - Part 1.
creating-with-data
Super Map World is a site that offers over 17,000 maps and map graphics.
Code & Learn: Set your mind in motion with a project vision
creating-with-data
Figuring out where to start with a new programming language or framework can be challenging. Searching for advice can inundate you with long lists of prerequ...
D3.js Spinning Globe Code Walkthrough
creating-with-data
In this walkthrough, we look at the code behind this spinning globe graphic rendered to web canvas using D3.js. 2026-06-01 Edit: Unfortunately, the visualisa...
Using a text input to filter map data with Leaflet JS
creating-with-data
In this follow-up video, we add another method of filtering data on our doctors’ practices map visualisation. If you’re not too familiar with Leaflet or Java...
Dataviz: Connecting the Atlantic
creating-with-data
“A treaty of peace has been signed between Austria and Prussia” - the first message that was transmitted across the Atlantic via telegraph. That’s the first ...
Mapping and filtering prescriptions data with LeafletJS (in-depth)
creating-with-data
In this video, we visualise data from a spreadsheet of doctors’ practices and prescriptions adding two methods for filtering. We deal with the issue of combi...
D3.js Choropleth Map Code Walkthrough
creating-with-data
Maps are some of the most shared and sought after forms of visualisation. In this video, I walk through an example that visualises unemployment data at the ...
Creating data-driven fabric designs with JavaScript - P2. coding the generative designer
creating-with-data
This screencast shows how to code a generate fabric patterns and visualise them as shirts using SVG and D3js. The patterns are composed of images gathered f...
Creating data-driven fabric designs with JavaScript - P1. scraping and data preparation with Node.js
creating-with-data
This screencast is part 1 of 2. It shows how to scrape imagery and data from the USDA’s online collection of pomological watercolours. This sets up an images...
Fruit of the algorithm: Generative fabric design
creating-with-data
This shirt was designed by code. More accurately, the fabric pattern was composed with the help of a generative design tool. It randomly selected and arrange...
D3.js Pannable Chart Code Walkthrough
creating-with-data
A code-walkthrough of one of Mike Bostock’s d3.js examples, Pannable Chart. In this video, I look at a fairly simple area chart, with the added twist of a sc...
Mapping the UK's oldest trademarks, part 2.
creating-with-data
The second of two parts, this video covers the front-end steps in creating a map of the UK’s oldest trademarks. Here we visualise the trademarks data we gath...
Mapping the UK's oldest trademarks, part 1.
creating-with-data
2026-06-01: Unfortunately, the visualisation is no longer available due to Glitch shutting down. How do you interrogate a 1M+ row CSV with (almost) all the t...
Dataviz: The UK's Oldest Trademarks
creating-with-data
2026-06-01: Unfortunately, the visualisation is no longer available due to Glitch shutting down. A map showing the oldest trademark for each postcode area in...
Exploring data from Companies House
creating-with-data
This video is an introduction to getting data from Companies House. It shows the steps of how you can get company details using both the web interface and th...
Principles of D3.js, a talk at Edinburgh.js
creating-with-data
A mostly introductory talk about D3.js at the Edinburgh.js monthly meetup. Contents: Is D3 a charting library? What is it good for? A taste of capabilities- ...