A few days ago I animated a day of Capital Bikeshare trips using a new Java program I had written in Processing (see Animating Data with Processing). I wanted the program to be flexible enough to allow people to customize for their own uses, so I put it to the test myself by making slight modifications to its display.

For the first customization, I wanted to zoom into Dupont Circle. It turns out that at this scale, drawing a frame every 60 seconds means bikes disappear from view without giving an impression of movement. So, I had to slow down the speed. The video below samples the data every 5 seconds (12 times slower than before), so you can follow individual bikes. The video displays 30 frames per second. The data is from October 5, 2012, from 8am to 8pm.


Casual riders are shown with dots that change from green to yellow, and registered riders are shown with dots that change from blue to purple.

When I moved the focus to the Wilson Boulevard corridor in Arlington, Virginia, it was clear the lower traffic levels couldn’t compete with Dupont Circle, which is the busiest CaBi station in the system. So I sped up the sampling, drawing a frame every 12 seconds. I added a second layer to the histogram, so it now shows both the number of bikes active in the view frame, as well as the number in use overall.

To show even more activity, I decided to overlap seven days, October 1 through October 7, with a different color for each day (and not differentiating between casual and registered riders).

Applying the same format to the National Mall wields a more chaotic scene. The station at 14th & Jefferson SW is the station most used by casual riders.

I went back to a single day, October 5. Because this area gets a lot of tourists, I wanted to see how many riders were going over the 30-minute time limit. So there’s a new method for display bike trips: casual riders are shown as green dots and registered riders as blue dots, as in earlier videos, but now I give them a halo. The halo is pale yellow as long as they are under 30 minutes, but once they enter overtime the halo changes to red.

These animations all came from the same set of data. They are just a few of the variations you can make to visualize the data. For help with implementing your own ideas, see Animating Data with Processing.

Neighborhood CaBi Animations

Leave a Reply