On Christmas we published an interactive game of sorts that lets you pick your own all-time team of New Yorkers who went on to the N.B.A, along with a selection of teams from some notable pundits and former players. There weren’t really a lot of sketches to post, but for me, the best part of the project was looking through old N.B.A. photographs from the NYT archives and, in some cases, from the players’ colleges. (Below, Bill Bolger, courtesy of Georgetown University.)
The project didn’t end up being a real hit traffic-wise, possibly because people were spending time with their loved ones on Christmas rather than playing games on the internet, or possibly because the actual audience is relatively small. Still, it was worth it for me – this feature had a lot of new features we hope to use again, including customized sharing and, I think, a good integration of Isotope – some of these features were used again on Interactive News’s Year on Page 1 project. I also got much better at scraping with R’s XML package, and I’ll try to post a demo here soon.
Finally, if you can’t tell, Dan Nguyen’s SOPA Opera was an obvious design inspiration for this.
Last week I posted a video from Jeremy White, loosely describing how he turned LIDAR data into a stunning model of Tunnel Creek. But more modeling yet went into showing exactly where the avalanche happened and how it traveled. My colleague Graham Roberts added trees, elevation lines and an actual model of the avalanche – its shape, depth, and size — as it flowed down the mountain. (The Swiss Federal Institute for Snow and Avalanche Research created the model specifically for this project.)
Below, a set of drafts that show the animation at various points along completion. These are courtesy of Graham, who rendered these in 3D, and Hannah Fairfield, one of the project’s editors.
Contrast these to the version that made it into the project (I failed at internet in trying to post that video here, but it looks better on the Snow Fall page anyway). You’ll see that they added elevation lines, toned back the background sound a bit and added a faint “tick” to help show the speed of the avalanche as it moved down the mountain.
The NYT published its Snow Fall project this week. (You’ve seen it, right?) It’s a large, immersive and complex multimedia storytelling piece by more than a dozen people. I had zero (zilch, none, undefined) to do with it, but I do have a blog, and Jeremy White, one of the folks responsible for the 3D animated flyover in the first chapter (it’s a video, not a gif), made a relatively face-melting video showing how it came to pass:
For those interested in making these on your own, it may be dispiriting to learn that Jeremy is all-but-dissertation in a PhD program for cartography and we are not. But he told me he didn’t use a ton of proper GIS for this – mostly 3D and data skills. (I don’t buy it totally, but whatever.)
In short, he made a 3D mesh in 3ds max from King County LIDAR data, added and georeferenced satellite imagery from the USGS, added some snow and atmospheric conditions (like fog) with V-Ray, thew in a touch of color correction, sent it to the department’s render farm (16 Mac Pros), and 48 hours later, boom, a 43 second video. Simple! (Obviously, it’s not; it took weeks.)
For those of you with extreme technical questions, Jeremy’s on Twitter and he loves talking about this stuff all day long. I sit right next to him, so I know.
Here’s a (still getting tweaked) R tutorial for the charts in the last post. Here’s the data you’ll need to download.
Set your working directory to wherever you want to work out of (usually a project folder)
setwd("/Users/pathToMyFolder...")
Next, load the data. Any format is fine, but our data is a tab-delimited .txt files, so we can use read.delim (here, my data is in a folder called “data,” but yours can be wherever).
data <- read.delim("data/states-data.txt")
Make a new field in your data frame that is the sum of unified states:
Now our data is ready to chart. It’s just one line of code to make a plot of the number of unified states over time, with “Year” on the x axis and “total.unified” on the Y axis:
The same plot, with extra arguments to clean it up a little:
plot(data$Year,data$total.unified,type='l',ylim=c(0,50),xlab="Year",ylab="States",main="States with unified control of state government since 1938",col="red",lwd=3)abline(h=c(0,10,20,30,40,50),col='lightgrey')abline(v=c(1940,1960,1980,2000),col='lightgrey')
Adding more layers onto the plot, drawing lines for Democratic- and Republican- unified states. (In general, “plot” makes a chart and “lines” add to an existing plot.)
Now we’ll make a barplot instead. The syntax here is a little weird, and I had to get Amanda to fix mine originally, but it’s not so bad. Basically, our data needs to be transposed and reduced to just the columns we want to plot. You can do this in one step, but for clarity I’ll break it up here. It looks like a waffle chart just because of the horizontal axis lines, but it’s just a barplot.
#just the numbers we want to plot data.we.need<-data[,c("Unified.D","Divided","Unified.R")] #a simple reshaping, transposing our datatransposed<-t(data.we.need) barplot(transposed,ylim=c(0,50),col=c('blue','grey','red'),border=F)abline(h=c(1:50),col='white')
We end up doing the same plot for the final output; it’s just shaped differently and has fewer axis lines. We’re also saving it as a pdf in the dimensions we want:
Last week, my colleague Monica Davey reported that starting in January, one party will control both the state legislature and governor’s office in 37 states, the highest that figure has been since 1952.
Numbers like that don’t always mean a chart will be good, but it usually means it’s worth at least checking out, so I got data from the National Council of State Legislatures, which had previously published a chart on their blog.
Getting data behind a chart you see on the internet isn’t groundbreaking work or anything, but it happens regularly in our daily work, and just because you can get the data easily doesn’t mean you can’t screw it up. Anyway, there are a number of forms this could have taken, so I thought I would share some.
The most basic chart to do here is to show the news: that the number of states with unified governments is at a 60-year high:
That does show the news, but not much else. Adding on lines depicting which parties have unified control per year (the black line is just the sum of the other two) helped a little:
But the lines look super noisy and I thought maybe someone would want to see the states more prominently. Here’s a waffle chart, with each square a state. (One cool byproduct with the area chart forms is you get to see the U.S. add Hawaii and Alaska – the “last” bump on this chart is when Minnesota switched from a nonpartisan legislature in 1972.)
That might look a little better, but it’s not like you get to identify individual states or anything, and it takes up more space than it deserves.
So a compromise was made, making it shorter, but in a similar style:
One problem with both of these forms is that you don’t actually get to see the main point of the story: that there are more unified states than ever before. But I couldn’t think of a smart way to get all those, and I admit I liked being able to see the distributions.
But another approach yet made it into the pages of the NYT. Charles Blow, an op-ed columnist and the paper’s former graphics director, liked the chart, and wanted to use the same data in his column. But he used it in a slightly different way. His approach lets you compare all three numbers by separating them into two charts:
So, given the news and the data, which form is best? Or care to make your own, better chart? The data is already online, but it’s in a cleaner format right here. I’ll happily post any charts as long as they’re politely submitted or worse than mine.
I’ll also post the (very few lines) of R code used to make these if you want to do some learnin.
Readers, aggregators and bored skimmers of chartsnthings will know that this is frequently a place for statistical sketches, many of which are made in R. Yet this is not because the New York Times Graphics department only makes statistical charts; more realistically, it’s because this blog’s frequent contributors stink at drawing. The department has a wide assortment of (frankly badass) illustrators, cartographers and 3D modelers, and I’ll try to include some more of their sketches in future posts.
In that spirit, my colleague Alicia Desantis agreed to share sketches from her recent Thanksgiving flow chart of turkey preparation decisions.
From Alicia:
Our original idea was to qualify 80 different turkey combinations. What’s the difference between a heritage bird that is roasted whole, brined and air-dried and one that is butterflied, brined and air-dried? Supposedly these decisions have consequences, right? The final turkeys would be rated in a number of factors: juiciness, crispness, cost, time-prep etc.
But this way of thinking about the story severely limited the number of variables and bogged us down in meaningless differences. So we moved to a decision chart — this way we could more clearly articulate what was at stake in each individual cooking choice. It also left some room for basic “tips” and commentary — and gave us an opportunity to experiment with a different voice.
Instead of not talking to your family at the Thanksgiving table, why not take a look through her design process? First, some thoughts in Illustrator…
Probably the best-known of the department’s graphics this election season is Mike Bostock and Shan Carter’s 512 Paths to the White House. Instead of posting on this in detail, I’ll just put up a few images and direct you to some stuff that’s already out there.
Next, Shan Carter’s recent talk at the Visualized conference in New York. (There was apparently a burst of applause when the first slides for this graphic came on the screen.)
These photos are from that talk, but there are dozens more if you read through the whole thing, which you should, obv.
And the final graphic, which was wired up to results on election night.
The only meaningful footnote I can add to this is that Mike Bostock described programming the animations as “really, really hard.” I read that to mean I need to give up programming immediately, but your mileage may vary.
and cleaning up in Illustrator again:
