Two color map + current event map

Two color map

Being able to use only two colors on a map might at first seems like a limitation. But it makes things much less cluttered and easier to understand, if you choose the right data to visualize.



This is a map of every building in Manhattan. Each blue bubble is a building, and the size of the bubble is determined by how many floors that building has. The background of the map is white, and the building bubbles are blue. The attribute that gives a meaning to the map layout is the bubble size.

Notice how easy it is to pick out the areas where skyscrapers exist. Better yet, zoom in a bit and the city begins to deconstruct. The space between buildings increases and you can see the relative footprints of a high-rise or a walk-up.

Current event map

I had been interested in the number of Americans who joined/tried to join ISIS after reading a couple articles about them. When we read about historical rebel groups, we tend to ignore the fact that that kind of thing can happen in our present day. At least I do. This was an attempt to humanize some of these people.




Using Odyssey.js I constructed a simple list of people and the places of their origin, along with short blurbs taken from the original article (dutifully cited in the first slide). It shows that potential jihadists can be found all over the country, and some are even that guy who "was a goofball in high school."

Foosball front-end

Link: Foosion

Partially for class, partially for fun, I created the front-end framework for some of my Cloudcommuting colleagues' foosball-centric RFID projects. The systems are not connected as of yet but by the end of the semester we should have a fully-functional identification system that updates the front-end in real-time.



There are several data points that we are recording:

  • Date of match
  • Winning player names
  • Winning team score
  • Losing player names
  • Losing team score

In future iterations we will be recording the goals scored by each player, as well as the time of the goals with respect to the start time of the game.

For this project I used AngularJS as the framework. Eventually it will be integrated with Node.js and MongoDB so that the front-end and the Yún(s) can communicate with the server and with each other. With this setup it will be feasible to display a foosball game live on the internet (similar to ESPN's Gamecast).

Since seeing the web site is helpful to understanding how the system works, please check it out at the link at the top of this post.

Noise mapping proof of concept

Link: http://hidden-fortress-3752.herokuapp.com/map.html

This week I made a proof of concept that would allow me to demonstrate what a live noise map might look like. Originally I was going to use real audio from multiple locations but I ended up using one audio file and just simulated the drop-off of noise levels at each successive node.

The map uses a hard-coded array of 44,100 decibel level samples (from a 44.1k audio file). The visualization steps through the values at a rate of 5 per second to simulate the rate that I had wanted to achieve with the actual system.




The color scheme is based on sound level intensity (green is low, red is high) and has a radius large enough to just overlap, creating a heatmap-style visualization. You can see the high-intensity noise travel through the nodes, and the heatmap smoothes the movement so the nodes don't display as discrete points.

County names = state names and a map of the news

I wanted to make an interesting map of all U.S. counties that are named after U.S. states. I was able to display the shapes of such counties but was unable to do anything further - following the slides verbatim I couldn't get ST_MakeLine to work (after substituting my own table names). Here's the initial map I created using the following SQL.

SELECT * FROM uscounties_merge WHERE name IN (SELECT state_name FROM uscounties_merge)



From here I was hoping to draw lines connecting the center of each shown county to the center of each state, respectively. There are a ton of counties named Washington and I wanted to show the intensities of the various namesakes. Again, I couldn't make the map, but here's a mockup of what could've been.


Midterm: Toward a Self-Sizing Mobility-on-Demand System Simulator

For our midterm project involving Citi Bike, my group (Aaron Arntz, T.K. Broderick) was interested in exploring how to simulate a self-sizing network. However, before we could do that, we needed to create a simulation that somewhat accurately depicted the behavior of the real system.

T.K. sculpted our overall message, tone and delivery – what was important about the system we were we aiming to simulate, and how would we connect our simulator to real world data to make it relevant? Aaron mined the Citi Bike System Data for clues about real-world behavior and refined them into data points describing stations and bikes. And I incorporated T.K.'s and Aaron's findings into a system simulator which I wrote from scratch in NetLogo.

In order to have as accurate a simulator as possible, we decided to populate NetLogo with the actual number of stations in their actual geography. The latitude and longitude of stations in the simulator are mapped to Cartesian coordinates so that the shapes of Manhattan and Brooklyn are easily distinguished.



To populate the stations' data, we used two types of information: (1) a snapshot of station capacities at a particular moment in time and (2) aggregate data from all trips in August 2014. Each station has the following fields:

  • Station ID (1)
  • # of available bikes (1)
  • # of available docks (1)
  • Master launch rate (2)
  • Launch table (2)

The last two fields are the most important for achieving realistic behavior. The master launch rate is the percentage of trips from a given station out of all trips. The launch table is a collection of destination station IDs whose frequencies match the percentage of trips from a given station to a given station. Note that the master launch rates and the launch table rates always add up to 1, respectively, as they account for all trips taken in August 2014.

Below is the launch table for station 339 (Avenue D & E 14 St), constructed from the percentage of trips from station 339 to any of the other station IDs in the list. Note that selecting a random item from the list will result in the selection of a given station ID with the same probability as actually occurred from this particular station in August 2014.

[339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 339 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 295 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 361 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 259 279 279 279 279 279 279 279 279 279 279 279 279 279 279 279 279 279 279 279 307 307 307 307 307 307 307 307 307 307 307 307 307 307 307 307 332 332 332 332 332 332 332 332 332 332 332 332 332 475 475 475 475 475 475 475 475 475 475 475 475 475 501 501 501 501 501 501 501 501 501 501 501 501 507 507 507 507 507 507 507 507 507 507 306 306 306 306 306 306 306 306 306 306 351 351 351 351 351 351 351 351 351 351 385 385 385 385 385 385 385 385 385 385 412 412 412 412 412 412 412 412 412 412 337 337 337 337 337 337 337 337 337 504 504 504 504 504 504 504 504 504 375 375 375 375 375 375 375 375 375 519 519 519 519 519 519 519 519 519 497 497 497 497 497 497 497 497 326 326 326 326 326 326 326 326 502 502 502 502 502 502 502 502 3002 3002 3002 3002 3002 3002 3002 3002 445 445 445 445 445 445 445 284 284 284 284 284 284 284 415 415 415 415 415 415 415 280 280 280 280 280 280 280 315 315 315 315 315 315 315 285 285 285 285 285 285 401 401 401 401 401 401 293 293 293 293 293 293 511 511 511 511 511 511 2009 2009 2009 2009 2009 455 455 455 455 455 518 518 518 518 518 393 393 393 393 393 341 341 341 341 341 350 350 350 350 350 263 263 263 263 454 454 454 454 428 428 428 428 335 335 335 335 312 312 312 312 363 363 363 363 296 296 296 296 264 264 264 264 347 347 347 347 224 224 224 224 297 297 297 297 433 433 433 161 161 161 266 266 266 250 250 250 342 342 342 2003 2003 2003 265 265 265 394 394 394 150 150 150 531 531 531 505 505 505 331 331 331 438 438 438 311 311 311 490 490 490 382 382 382 260 260 260 2012 2012 2012 410 410 410 317 317 376 376 379 379 302 302 380 380 168 168 528 528 127 127 316 316 2023 2023 304 304 540 540 236 236 174 174 400 400 486 486 404 404 360 360 473 473 432 432 305 305 496 496 2006 2006 237 237 532 532 512 512 153 153 301 301 483 435 2022 494 358 345 521 310 308 491 320 392 487 349 232 294 411 482 444 212 291 459 173 128 303 252 340 79 457 300 461 318 405 116 2017 229 427]

To better represent the stations' states, they are color-coded to match their current usage. Green stations are balanced (i.e. less than 95% full and greater than 95% empty), red stations are too full (i.e. greater than 95% full), and blue stations are too empty (i.e. less than 5% full). Here is the state of the system before any simulation has occurred:



Our focusing on stock rebalancing issues meant defining the concept of station balance, or the potential use of the station compared to its actual use. The goal of a self-sizing system would be the spread the usage evenly (or better yet, optimally) over all stations so as to minimize congestion due to either a shortage of bikes or a shortage of docks.

The final piece of the simulator was to model the basic behavior of a user (bike) arriving at a station that is completely full. We guessed that a realistic radius for seeking out an alternate station is 0.4 miles, or about 8 minutes walking. The bikes in the simulator wait a short amount of time, then proceed to another station within this radius if no docks are available.

After running the simulator many times it was clear that our model highlights one of the basic truths of the system: on average more bikes are launched from Manhattan stations than Brooklyn stations, and this causes an imbalance if no restocking is performed. This can be seen in the progression below (the first image is the same initial system state shown above).


We were pleased to identify some of the same stations that our previous visualization picked out. This gives further proof that their are certain stations that may be candidates for self-sizing and/or elimination.



Having this simulator as a base for our future exploration of the Citi Bike system is an important step, and we are pleased that we were able to make such progress for our midterm project.

Three maps, three lies

A lie told about space
Link: Population Density - Derek Watkins


This map shows the world's population density using a slider to move through the various density levels. Viewed at the slider's lowest density threshold, the world's continents are clearly visible. However, when the slider is set at the maximum density, the map is pretty meaningless. Plus, the extreme minimalism and low resolution of this map is very misleading. At 500 people per square kilometer, we should be able to see hundreds of metropolitan areas in the United States (Reno, Nevada is at about 800 people per square kilometer), not to mention plenty of other places in the world.

An unintentional lie
Link: US Stream Names - Derek Watkins


This map is one of a trend of maps showing local terminology across the country, in this case the names of natural watercourses. Because of the high-contrast visual design, it's easy to assume that the blackout areas either have no corresponding data, or that they don't have one predominant nomenclature. This isn't true, though - buried as a footnote to the map description, the gray and black areas are where the terms "river" and "stream" are most common. This map has essentially removed from view the largest data points in favor of the more uncommon names. I think this was an unintentional result of the visual design, as this map would've been just as interesting.

A clear distortion of the truth
Link: A Texan's Map of the United States


Novelty maps often distort reality for comedic effect. This map does exactly that by enlarging the geography of Texas in relation to the rest of the U.S., mimicking the stereotype of the proud Texan's perception of non-Texan areas as inferior and/or physically smaller. The labels also reinforce stereotypical prejudices of Texans.

Abstract noise map


In order to make a map that changed depending on the user, I used browser geolocation to center a map over the user's current location. Then I zoomed in as far as I could into the visualization I created, which paired U.S. county shapes with population density for each U.S. county.

I made a choropleth to try to estimate the average noise level for a user's current location based on the population density of the corresponding U.S. county. While the link is tenuous at best, it abstracts the idea of distinct zones of noise that I think make sense to most people.

After the browser detects your current location, you will see a huge area of bright color (because of the high zoom level). You can compare this color to the scale in the legend at the bottom-right of the map to see how your location's noise "profile" stacks up against the rest of the country. I wanted to make the visual aspect as simple as possible and I think I at least succeeded on that level.

Here's an embedded version (for geolocation please visit the link at the top of this post):