Visualizing MBTA Data
JavaScript HTML CSS

Visualizing MBTA Data

Visualizing MBTA Data is a web based interactive visualization that provides a glimpse into the performance and behavior of Boston's subway system.

Check it out:

See our blog post describing this source code, and wiki pages with detailed explanations of the data format for each visualization. We have also given several talks on this project. Here are the handouts from each:

Quick Start

  1. Install node.js
  2. Install bower to grab dependencies, less to compile style sheets and http-server to run the website

    npm install -g bower less http-server

  3. Install dependencies

    bower install

  4. Compile less css files into a single stylesheet

    lessc --clean-css styles/main.less > styles/main.css

  5. Serve up the website


  6. Browse to http://localhost:8080/ to see the visualization

Source Code Layout

data\                post-processed visualization data
scripts\             JavaScript files for the visualization and the website
styles\              less CSS stylesheets and main.css that they are compiled into
media\               Opengraph/Twitter Card images
bower.json           bower dependencies
favicon.ico          map glyph favicon with animation
handout.pdf          design and implementation notes
ie.png               website rendered to an image for browsers without svg support
index.html           landing page            README file that appears on the website's github page

Regenerating Stylesheets

The visualization loads main.css which is generated from all of the less files in the styles/ directory. If you change any of the less stylesheets use the less compile to regenerate main.css as described above:

lessc --clean-css styles/main.less > styles/main.css

For more information see

Raw Data

The raw data is available from two sources. A compressed csv file with per-minute turnstile entry and exit counts from each station is made available with permission from the MBTA:

NOTE: some stations don't accurately measure turnstile exits, so entry counts will tend to be more accurate.

Also the realtime subway and alert JSON files collected for the month of February are available here:

They are stored in hourly gzipped files in the following format: subway-line/yyyy/mm/dd/hh/data.json.gz where each line of the ungzipped file contains a JSON blob polled from the MBTA's realtime feed described here. All times use Eastern Standard time zone.


Mike Barry

Brian Card


Copyright 2014 Michael Barry and Brian Card.

JavaScript source files and less stylesheets released under the MIT License.

All other files including this README, the main web page, and images made available under Github's terms of service