Data Visualisation with D3.js

Meteor World Map

Represents meteor impact recordings across the globe, each hit represented as a point of varying size and colour, corresponding to its mass. Allows users to hover each point to view more information. Data is provided by a TOPOJSON API and is scalable in that the size variations are evened out by a logarithmic function.

USA Education Data Choropleth

View Code Live Demo

A choropleth map of all counties in the US representing the portion of the population with a Bachelors degree or higher.

Product Category Tree Map

View Code Live Demo

A tree map with variable inputs to display top sales in the categories of ‘Video Games’, ‘Movies’, and top funded Kickstarter campaigns.

GDP Interactive Bar Chart

View Code Live Demo

A simple bar chart with a hover tooltip created to map US gross domestic product from a JSON API.

Scatter Plot Graph

View Code Live Demo

An interactive, time-based scatter plot graph rendering static data for doping statistics for the Alpe d’Huez fastest race times, served from a static JSON file.

Climate Heat Map

View Code Live Demo

A heat map showing earth surface climate temperature per month over several hundred years. Heat data is represented by colour and a sliding bar at the bottom. Data again server through a JSON API.

State Contiguity Force Directed Graph

View Code Live Demo

A Force Directed Graph showing state contiguity for all countries in the world. Force directed graphs (FDG’s) represent data as nodes on a meshwork and give the user the ability to drag and hover individual nodes to see the country name.