Where I spent my time during a really long flight

If you’re interested in keeping up with my writing, sign up for my newsletter!

It was my fault, really. I don’t like flying, and I don’t sleep well in planes, but I still booked a 28-hour flight from Manila to New York. I honestly thought I was ready for it. I had melatonin pills, a neck pillow, a sleep mask, a blanket, and a pair of socks. Knocking myself out was my number one goal. That, I thought, was how I would survive this flight. While I did manage to fall asleep, I kept on waking up because some part of me would start to get sore from being confined in a chair for so long.

The first part of the round trip flight was actually a pretty good deal. For $800, I was able to go to Germany (stayed for 12 hours) and to Singapore (stayed for 5 days) before finally flying out to the Philippines. I got to visit countries that I’ve never been to before, and I also got to spend time with friends that I haven’t seen in a long time.

The coming back part, unfortunately, meant that I have to go from Manila to Singapore, Singapore to Germany, then Germany to New York. It was an unnecessarily long trip, and because I kept on waking up, I thought I’d do something fun instead. Like maybe log the activities that I did in the flight.

It’s unfortunately not the most accurate data because some activities overlap like eating while watching a movie. I also didn’t have the foresight to jot down the time when I would stop doing something, e.g., I would log the time when I started eating but not when I finished. But even then, I think the logs were still good enough to learn from.

I didn’t know how to represent the data at first. I wanted something more creative and outside of the usual charts that I’ve made before. But the other day, I ran into a Sketch plugin that created spirals. So I thought that maybe I could represent the data as a snail because of how unbearably long the flight was.

So after a couple hours of trial and error with both the 6Spiral and Looper plugins, I came up with a shell where each spiral represented 30 minutes of activity. Behold, my snail collection!

Since I didn’t log (more like forgot to log) absolutely everything, there is a “miscellaneous” category in there that includes a hodgepodge of things like going to the bathroom, daydreaming, listening to a podcast, brushing my teeth, and changing my clothes.

Looking at the visuals, I’m kind of surprised that I logged 9 hours of sleep. It wasn’t the restorative kind of sleep for sure, but it was still a substantial amount of time. I’m guessing a good part of that was spent tossing and turning in the seat.

Another surprising part is how small the music-listening and watching category are. I went through several albums and TV shows on the plane, but I guess that didn’t really amount to much. Or it could be that I was too distracted to log. We’ll never know.

I’m thinking in the future I could look into animating each spiral similar to this, so I’ll look into that when I have the time. Anyway, I wish you never have to take such a long flight in economy class!

The Sketch file can be found here.

Where are the bikers?

If you’re interested in keeping up with my writing, sign up for my newsletter!

I briefly visualized some of the data that I got from Indego in my last blog post, and we saw that most people used Indego for work: It spikes at 8am and then again at 5pm. Basically it showed the start of an average work day.

What was also interesting was that activity basically died down during the weekend—something that I didn’t really expect to happen! I really thought that Indego would also spike on the weekends, but what we see is more uniform. It’s still a sizable amount of people, but it makes sense that it’s not bunched up to a specific hour.

But it made sense: you don’t have to worry about theft, flat tires, maintenance, or even just carrying it up your apartment. It was easy to find because you can find bike docks all over the city.

So in this round of data spelunking, I wondered: Which neighborhoods have the most bike borrowers in Philadelphia? And where can you find these bikes?

Based on the GeoJSON data at Indego, there are 130 active stations available in the city, and I plotted them on the map along with neighborhoods where people borrow bikes the most. It turns out that the areas University City, Logan Square, Rittenhouse, and Washington Square West are the ones that see the biggest ridership.

This visualization was created using the data from the fourth quarter of 2018 which had 65,535 bike trips that were recorded from October to December. Here’s a map of the whole Philadelphia county for a more zoomed out view:

It’s interesting to see a large number of people borrow bikes in Center City because the area is already packed with cars. It makes sense that people are seeking alternative ways to get to work.

The visualization was created using neighborhood data from Azavea, street data from the City of Philadelphia, and of course data from Indego. I started out by simply displaying the polygons of the neighborhoods:

Next, I wanted to color the polygons that had the bike dock coordinates. Since the biking data is huge, I thought it would be easier and faster to use a smaller, more familiar set from my personal SEPTA trips.

Figuring out if a coordinate fell into a polygon was thankfully straightforward through D3-Geo by calling d3.geoContains. I wrote a small loop that went through each neighborhood polygon and each station coordinate:

Running it with the SEPTA information was easy, but it took around 10 minutes when I switched to the biking data. If I’m going to do this with an even larger data set (like Citibike in NYC), I’m going to have to figure out a way to make it run faster.

After generating the table of data containing the number of bikers borrowing in a certain neighborhood polygon, I combined that with the map data (with a lot of help from existing examples) I got to make this:

I then added the points of all the Indego bike docks to show where they are on the map.

Then finally adding another layer that draws the streets based on geodata from the City of Philadelphia to add some context on which streets these bikes are located at. Also it looks damn pretty.

One thing to note is that you’ll notice that I used the ending latitude and longitude (the dock where they ended up after the trip) to create this map, and it actually surprised me that using the starting coordinates would generate the same map! It turns out that there’s little difference between where people start and where people end because they—I’m assuming—will eventually bike back to where they came from.

I think there are more interesting ways to visualize this data, but I didn’t have much time to do additional explorations. Stay tuned for next time!

What are your commuting habits?

I recently did a lunch and learn at my co-working space, and these are the slides that I used. This post is a little different from the content in the slides, but the gist is the same. Hope you enjoy reading it! If you’re interested in keeping up with my writing, sign up for my newsletter!

I’ve seen a lot of wonderful data visualizations on websites like Flowing Data or The Pudding, but I never had the desire to do my own visualizations. The data seemed daunting and inaccessible—I mean, where do I even get that kind of data? How do I even make sense of those big data sets? So I put any hopes and dreams of me doing interesting visualizations in the stuff-I’ll-never-get-to-do bucket.

But then I ran into a book called Dear Data. It was a year-long project by two women who each drew their personal data, and sent them across the Atlantic. Here’s a video that describes the project well:

I was inspired—it didn’t occur to me that I could use my own personal data instead of downloading some big data set out there for me to visualize. I’ve coincidentally been interested in public transit recently, and I thought that visualizing my commuting habits would be a good start.

Gathering data

I happened to know that most of the trips that I’ve made are online because I use a digital key card to get to all modes of transportation here in Philadelphia. That covers trains, buses, and trolleys.

A screenshot of septakey.org which shows the trip history for the digital key that I use.

The hardest part was exporting this data into something that I could play around with. So I had to copy paste each row into an Excel sheet so that I could start playing with it as a CSV. It was such an arduous task that if I were to do this again in the future, I would use a tool like Puppeteer to scrape the data for me instead.

A screenshot showing how you can request your ride data on Lyft. It also shows the e-mail that you receive after you request the data.

Getting my data from Lyft was thankfully easy. All I had to do was to go into the app and export the rides into a CSV which you get as an e-mail attachment.

Now what?

I was a bit stuck after I gathered all the data that I needed because I wasn’t sure how to create the visualizations that I wanted.

I vaguely knew things like Observable and D3, but the examples looked pretty daunting especially since I didn’t know how to create SVGs from scratch. Fortunately, I ran into Vega-Lite which made visualizations a little bit easier because you didn’t have to hand-write the SVG graphs.

It took a bit of trial and error before I got the hang of it, but the first thing that I was able to make was a scatter plot showing all the train stations and bus stops that I’ve been on in the last 9 months. In there, you can clearly see that I have been going to Girard Station – MFL most often since that’s where I live, but also 2nd St Station – MFL because that’s where I go to work.

A scatter plot showing each trip that I made and the station that I was in.

Compressing that scatter plot to show just the modes of transportation, you’ll see when I only started using the bus and the trolley in October and November of 2018. I used to be very confused with the bus, but apps like Citymapper and Transit App have made it a lot more accessible for me.

A plot showing the modes of transportation that I’ve been taking each month.

One thing that I really wanted to know was when I took public transit, and thankfully Vega-lite makes this easy. They even have an example of it!

The result was pretty, but a bit disappointing to see how random my trips are. But there is some insight in there: It looks like I don’t travel much on Tuesdays or Thursdays, but I travel a lot on Friday, Saturday, and Sunday to hang out with people and do chores.

A punch card showing when I commute and travel around Philly.

Lyft Data

Another thing that I wanted to see was how my transit expenses have changed over the last couple of months. I used to be an avid Lyft user because of its convenience, but it’s really hurt my wallet in the past. So I wanted to compare that data with my public transit data.

What came out was honestly pretty disgusting. I spent so much on Lyft in August and September that it hurts to look at it. This was pretty much my braking point and why I’ve been taking public transit more. In October I said to myself that I wouldn’t spend that much money just to go around a city.

A graph showing the cost of taking public transit vs. Lyft.

What’s also interesting is that I’m moving around more than ever. I graphed the number of rides I’m taking (that is, how often I commute), and I’m at an all-time high—all without the associated costs.

A graph showing the number of trips I’ve been taking on public transit vs. Lyft.

You can see that I still take some Lyft rides, but these days I only use them when I’m in a hurry or if I’m carrying huge bags of groceries. There’s research that says that ride-sharing and public transit are complimentary. I agree.


Wouldn’t it be cool to see all of my trips on a map? Now I don’t know much about mapping, but Leaflet seemed like a good place to start so I read up on that. Unfortunately, I had to map the stations to actual lat-lng coordinates that I found on Google Maps. It was tedious work, but I did manage to get a heat map working.

In the heat map below, you’ll see that I’m generally in three locations: home, work, or center city. No surprises there.

A map that I created using Leaflet and a plugin called Leaflet.heat.

Zooming in closer shows the specific stations that I take. Everything looks right aside from the fact that 2nd St. Station is missing so I might have made a mistake on the coordinates there.

A zoomed in map showing the individual bus stops and stations that I’ve been to.

Bonus Round

So in Philadelphia there’s another mode of transportation that I haven’t talked about: bikes! I’m a bit too scared to ride the bike in the city (for now), but the City of Philadelphia publishes the data on all the bike trips made every quarter.

A bunch of people on their Indego bikes.

So I took that data and looked at what would happen if I simply plugged it in to my existing graphs and maps.

The heat map generated is interesting. With a few tweaks it shows that a lot of the trips (at least in the first quarter of 2018) are concentrated in the center of Philly. There are some blips in University City on the left of the blob, and some in the museum area on the upper left corner of the blob.

A heat map generated from all the Indego bikers in the first quarter of 2018.

I also wanted to know when people borrowed the bikes. If you asked me, I would’ve assumed that people used the bikes more on the weekends or for leisure. But when I ran the data, it clearly shows that people use it mostly for work. You can clearly see the 9am and 5pm crowd, and you also see it dying down on the weekends.

It was interesting because I assumed that people who biked to work owned their bikes. But at $17 a month, it looks like Indego is a good deal for people not wanting to pay upfront for a bike, do maintenance on it, and worry about it getting stolen.

A punch card chart of everyone’s bike trips in the first quarter of 2018.

Source code