Embed Size (px)
DESCRIPTION
Design Choices in Visualizing Bike Transportation in Chicago.
Citation preview
@gabegaster | http://bit.ly/1pdP2Tb
Design Choices to Visualize Transportation
in Chicago
@gabegaster | http://bit.ly/1pdP2Tb
Design Choices to Visualize Transportation
in Chicago
why I like Divvy
or
@gabegaster | http://bit.ly/1pdP2Tb
Difficult
Public Transit on the grid
=+ Diagonals
@gabegaster | http://bit.ly/1pdP2Tb
Difficult
Public Transit on the grid
=+ Diagonals
2+ buses = FAIL
@gabegaster | http://bit.ly/1pdP2Tb
show how has divvy changed where people can go
viz Goal:
@gabegaster | http://bit.ly/1pdP2Tb
show how has divvy changed where people can goshow where people actually go
viz Goal:
@gabegaster | http://bit.ly/1pdP2Tb
one way is with an arrow
A B
How to show where people go from here?
@gabegaster | http://bit.ly/1pdP2Tb
good for abstract relationships
one way is with an arrow
@gabegaster | http://bit.ly/1pdP2Tb
@flowingdata
maybe notbut the map here sure is great
lines between pts?
@gabegaster | http://bit.ly/1pdP2Tb
how else to represent stations?
lines between pts?
@gabegaster | http://bit.ly/1pdP2Tb
how else to represent stations?
on a map
lines between pts?
@gabegaster | http://bit.ly/1pdP2Tb
how else to represent stations?
on a mapbut how?
lines between pts?
@gabegaster | http://bit.ly/1pdP2Tb
how else to represent stations?
on a mapbut how? • nodes?
lines between pts?
@gabegaster | http://bit.ly/1pdP2Tb
can use gradient — to show gradual differences between stationsLondon transit map
@mySociety
@gabegaster | http://bit.ly/1pdP2Tb
how else to represent stations?
on a mapbut how? • nodes?
• regions?
lines between pts?
@gabegaster | http://bit.ly/1pdP2Tb
@mySociety
@mbostock
or use natural borders?
London transit map
@gabegaster | http://bit.ly/1pdP2Tb
each point is related to the closest station
what regions?
@gabegaster | http://bit.ly/1pdP2Tb
each point is related to the closest station
what regions?
—> Voronoi
@gabegaster | http://bit.ly/1pdP2Tb
each point is related to the closest station
what regions?
—> Voronoihuh?
http://alexbeutel.com/webgl/voronoi.html
@gabegaster | http://bit.ly/1pdP2Tb
each point is related to the closest station
what regions?
—> Voronoihuh?
http://alexbeutel.com/webgl/voronoi.htmlFind the closest station — that’s my region!
@gabegaster | http://bit.ly/1pdP2Tb
recap: stations are voronoi tiles
too many edges to show…
@gabegaster | http://bit.ly/1pdP2Tb
recap: stations are voronoi tiles
too many edges to show… what about using color?
@gabegaster | http://bit.ly/1pdP2Tb
how touse color?
• two colors for value
colors v colors
@gabegaster | http://bit.ly/1pdP2Tb
how touse color?
binned v gradient
colors v colors
• two colors for value
@gabegaster | http://bit.ly/1pdP2Tb
• hard to read • differences subtle
gradient
@gabegaster | http://bit.ly/1pdP2Tb
how touse color?
• two colors not many • binned not gradient
binned v gradient
colors v colors
@gabegaster | http://bit.ly/1pdP2Tb
how touse color?
• two colors not many • binned not gradient
binned v gradient
colors v colors
binned
@gabegaster | http://bit.ly/1pdP2Tb
how touse color?
• two colors not many • binned not gradient • transparent empty bin
binned v gradient
colors v colors
binned
@gabegaster | http://bit.ly/1pdP2Tb
how touse color?
• two colors not many • binned not gradient • transparent empty bin • iterate
binned v gradient
colors v colors
binned
@gabegaster | http://bitly.com/bundles/gabegaster/1
• dispersion (where people can / do go)
with these choices, the viz emphasizes:
• exploration
@gabegaster | http://bitly.com/bundles/gabegaster/1
lookbubbles
cool
@gabegaster | http://bitly.com/bundles/gabegaster/1
what can we learn from this?
urban vs lake frontcommute vs party
vs train
there’s me, too.hipster vs yuppie
@gabegaster | http://bit.ly/1pdP2Tb
Thanks
check out the blog post with more detail
