A platform for teaching, learning, and practicing

Data Visualization

using D3.js and SVG.

Check out this online data visualization course.

Try VizHub 2.0 Beta!

Recent Visualizations

Let's make a face with D3.js!

Massachusetts City Population by Burglary

Let's make a face with D3.js!

Vega-Lite API Template

Massachusetts City Population by Burglary

Shapes with SVG and CSS

Shapes and Colors with SVG and CSS

Circles on a Map of Slovakia

Customizing Axes

Temperature in San Francisco Scatter Plot Area

Temperature in San Francisco Scatter Plot

Customizing Axes

Melting Data for Multiple Lines

Lego Sets by Year from Rebrickable

Let's make a face with D3.js!

Let's make a face with D3.js!

Circles on a Map

Rendering Data with React & D3

Lego Sets by Year from Rebrickable

World Population Area Chart

Customizing Axes

World Population Area Chart

World Countries Tree

Responding to Resize

Face examplle with D3.js

Harvard/MitX Video Views

Responding to Resize

Shapes and Colors with SVG and CSS

Shapes and Colors with SVG and CSS

Shapes and Colors with SVG and CSS

Responding to Resize

Shapes and Colors with SVG and CSS

Massachusetts City Population by Burglary

Massachusetts City Population by Burglary

Cars Scatter Plot

Let's make a bar chart!

Shapes with SVG and CSS

Shapes and Colors with SVG and CSS

Loading Data with React & D3

HTML Cars Report

Participants in Opiate Treatment Study

Let's make a face with D3.js!

Axes with React & D3

The Margin Convention

The Margin Convention Outtake

BMI in different US Region and Comparison Between Smoker/Nonsmoker

New York Low to Moderate Income

A Multicenter Clinical Trial of Buprenorphine in Treatment of Opiate Dependence

Buprenorphine in Treatment of Opiate Dependence Study

Harvard/MitX Video Views

Vega-Lite API: College Scorecard Price

Vega-Lite API: College Scorecard Outcomes

Vega-Lite API: NACRO Survey Data

Pathetic Bar Chart

Rendering Data with React & D3

Rendering Data with React

Loading Data with React & D3

Stylized Scatter Plot with Color Legend

Fork Test - DELETE ME

Vega-Lite API Template

Assets Under Management (AUM) in Boston

Vega-Lite API Template

Vega-Lite API Template

Global Terrorism Dataset Visualization

Earthquakes in Turkey

Google Play Store Apps

Vega-Lite API Template

World Economic Freedom Index

House Price in Ames

Vega-Lite API Template

Top Rated Books from Goodreads

Hello Vega Lite API

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Ramen Rating Viz

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Murder in United States

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Logan temperature range VS precipitation

murder_total_deaths

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Ramen Ratings Across 11 Countries

Academic Publication Influence on University Ranking

Vega-Lite API Template

Vega-Lite API Template

Suicide Statistics in 30 years

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

ILINet Flu Surveillance Data

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

MRI and Alzheimers Data

MRI and Alzheimers Data

OSRS Grand Exchange

WOW Avatar History (Race vs Total Level)

Franchise Revenues - Revenue by Franchise

Television Show Ratings - Rating by Season

Television Show Ratings - Rating by Show

Franchise Revenues - Revenue by Year

Student to Teacher Ratios - Ratio by Education Type

Medical Cost Personal (charges vs bmi)

Top 100 songs of 2018

Vega-Lite API Template

Vega-Lite API Template

Google Play Store Apps

Google Play Store Apps

Google Play Store Apps

Vega-Lite API Template

Google Play Store Apps

Vega-Lite Grouped Bar Chart

Vega-Lite API Template

Boston House Dataset Part II

Vega-Lite API Template

Vega-Lite API Template

Google Play Store Apps

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Boston House Dataset Part I

Vega-Lite API Template

Vega-Lite API Template

Melting Data for multiple lines | selecting a Year

Harvard/MitX Video Views

Vega-Lite API Template

Vega-Lite API Template

Melting Data for multiple lines | interractive Legend

Let's make a face with D3.js!

Demographics of Social Media

Vega-Lite API Template

Demographics of Social Media

Vega-Lite API Template

Vega-Lite API Template

Loading and Parsing CSV Data

Medical Cost Personal Datasets

WOW Avatar History Dataset

Line Chart multiple lines | interractive Legend

Bowl of Fruit - General Update Pattern Special Cases

제대로! 아주좋아!

Customizing Axes

Google Play Store Apps

Google Play Store Apps

Making a bar chart

Vega-Lite API Template

Logan weather 2016-2018

Vega-Lite Grouped Bar Chart

Customizing Axes

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

New York Airbnb

3D Scatter Plot

Histogram Smoothing

Smiley Face Part II

Smiley Face Part II

Vega-Lite API Template

Graduate Admission

Vega-Lite API Template

Bowl of Fruit - Click to Select

New York Airbnb

Vega-Lite API Template

Google Play Store Apps

Student Performance

Nuclear Explosions Number vs. Time

Fallen Meteorites Map

Nuclear Explosions with Purpose

Nuclear Explosions Map

Nuclear Explosions

Sessions Entrainement et courses

Making a bar chart

Let's make a map

Smiley Face Part II

Sessions Entrainement et courses

Loading and Parsing Zoo CSV Data

Lego Sets by Year from Rebrickable

Scatter Plot of Life Expectancy Data_SchoolingVsLifeExpectancy

Scatter Plot of Life Expectancy Data_BMIVsLifeExpectancy

Loading and Parsing Zoo CSV Data

Zoo Scatter Plot

Cars Scatter Plot

Zoo Scatter Plot

Making a Bar Chart

Vega-Lite API Template

Let's make a face with D3.js

Vega-Lite API Template

Shapes with SVG and CSS

Scatter Plot of Life Expectancy Data_DiphtheriaVsLifeExpectancy

Vega-Lite API Template

HTML Cars Report

Vega-Lite API Template

Vega-Lite API Template

Customizing Axes

Vega-Lite API Template

Bowl of Fruit - General Update Pattern

Vega-Lite API Template

Religions of Largest 20 Countries

Lego Sets by Year from Rebrickable

Students Performance in Exams

Graduate Admission

Top 100 Songs of 2018

Responding to Resize

Responding to Resize

Zoo Scatter Plot

Customizing Axes

Let's make a face with D3.js!

Shapes and Colors with SVG and CSS

Customizing Axes

World population|Circles on a Map

Camera Max Resolution Vesus Price

Let's make a face with D3.js!

Let's make a face with D3.js!

Google Play Store Apps

Flight count by year

Vega-Lite API Template

MRI and Alzheimers Data

Flight count on Origins

Massachusetts City Population by Burglary

Insurance charge in differnet US area

Scatter plot of Minimum Wage Data_StateVsMinWage

Religions of Largest 20 Countries

Vega-Lite API Template

Shapes and Colors with SVG and CSS

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Loading and Parsing CSV Data On GitHub Gist

Business and finance courses on Udemy

Smiley Face Part II

Let's make a face with D3.js

Flight delay Data

Google app data

Choropleth map of Slovakia

Loading and Parsing CSV Data

Lego Sets by Year from Rebrickable

Shapes Using SVG and CSS

HTML CAR REPORT

Vega-Lite API Template

Shapes and Colors with SVG and CSS

The Low- to Moderate-Income (LI) New York State (NYS) Census Population Analysis dataset

Interactive Cars Scatter plot with menus

Cheap tricks for Slovakia

Cheap tricks for interaction

Map of Slovakia II

Scatter Plot of Life Expectancy Data_YearVsLifeExpectancy

Vega-Lite API Template

Healthcare Stroke Data -Area Plot

Smiley Face Part II

Smiley Face Part I

Smiley Face Part II

Smiley Face Part I

Smiley Face Part II

HarvardX, MITX 2013-2014 Users

The Low- to Moderate-Income (LMI) New York State (NYS) Census Population Analysis dataset

Shapes and Colors with SVG and CSS

World Countries Tree

Loading Data with React & D3

Hey its Mircalin

Smiley Face Part II

Loading and Parsing US birth 2000-2014 CSV Data

Loading and Parsing Kent UK police stop and search CSV Data

Loading and Parsing Free code camp Facebook activity CSV Data

Esperimenti html-css-svg

My visualization

Shapes and Colors with SVG and CSS

Shapes with SVG and CSS

Car data visualization on mpg, price and origin

Top 150 US School Data

Let's make a face with D3.js!

Shapes with SVG and CSS

HTML Cars Report

2015 Seattle House Price data

Smiley Face Part II

Clickable Cloropleth

Lets make a face with D3

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Vega-Lite API Template

Cheap Tricks for Interaction

Let's make a face with D3.js

Let's make a face with D3.js

Cars Scatter Plot

USA Airport Geographic Info

Google Play Store Apps

Customizing Axes

2019 Index of Economic Freedom

Chicago Employee Reimbursements

Pizza Restaurant and Its Pizza

House Price in Ames, Iowa

Goodreads book data

Loading and Parsing CSV Data for Bee Colony Census Data by State

Nwe York Airbnb

Loading and Parsing CSV Data for Bee Colony Loss Data

Cocktails (Hotaling & Co.)

Loading and Parsing CSV Data for Bee Colony Census Data by County

World Population Area Chart

Smiley Face Part II

Temp in SF Area Chart

Hey its Mircalin

Temp in SF Line Chart

Loading and Parsing CSV Data

Loading and Parsing CSV Data

[GTD]Loading and Parsing CSV Data

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Smiley Face Part II

Loading and Parsing CSV Data

Shapes with SVG and CSS

Most Recent SEC Form ADV

World University Ranking

Ramen Ratings Data from Kaggle

HTML Cars Report

Suicide Rates Data from Kaggle

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Loading and Parsing CSV Data

Temp in SF Scatter Plot

Loading and Parsing CSV Data

Lego Sets by Year from Rebrickable

Lego Sets by Year from Rebrickable

Customizing Axes

Let's make a face

Let's make a face by D3

let's make a face with D3

Shapes and Colors with SVG and CSS

Shapes and Colors with SVG and CSS

Smiley Face Part I

Lets make a face with d3.js

Shapes and Colors with SVG and CSS

Smiley Face Part I

Loading and Parsing CSV Data On GitHub Gist

Smiley Face Part II

Smiley Face Part II

Smiley Face Part III

Lego Sets by Year from Rebrickable

Television Show Ratings

Student to Teacher Ratios

Franchise Revenues

Loading and Parsing CSV Data: College Scorecard Data

Scatter Plot with Menus

Loading and Parsing CSV Data: College Scorecard Outcomes Data

World Countries Tree

3D Scatter Plot

Let's make a face with D3.js!

Bowl of fruits LEGEND

Custermizing Axis

Lets make a map with D3.js

MIT Technicolor Campus Map

MIT Technicolor Campus Map

Auto MPG Summary

Let's make a map with D3.js!

Bowl of Fruit - Hover to Select

Customizing Axes

Bowl of Fruit - Click to Select

Cars Scatter Plot

Let's make a face with D3.js!

Cars Scatter Plot

Scatterplot - Events in Amsterdam

Loading and Parsing US Minimum Wage by State from 1968 to 2017 and 2018 Equivalent Dollars CSV Data

Loading and Parsing CSV Data

Loading and Parsing Life Expectancy CSV Data

Smiley Face Part II

Smiley Face Jackie Turner

Loading and Parsing CSV Data On GitHub Gist

Loading and Parsing CSV Data On GitHub Gist

Loading and Parsing Healthcare Dataset Stroke CSV Data

Cars Scatter Plot

Fallen Meteorites

Nuclear Explosions

Customizing Axes

Smiley face pt1

Lets make a face

Let's make a face with D3.js!

Automation and Its Impact on Jobs

Lets make a face

Massachusetts Student Attendance and Retention

Massachusetts DESE AP Performance

Massachusettts Drop Out Rates

Making a Bar Chart

Create a bar chart