One of my favorite map visualizations is Ben Fry’s ZipDecode, a 2004 project that shows the hierarchical nature of zip codes with a simple interaction. I wanted to play with it and was frustrated at how hard it was to run a Java applet these days. So I rewrote it: ZipDecode in Javascript.

Well I rewrote the easy parts. I left out the zoom, although that would be pretty straightforward using D3 transitions. And I left out the color transitions; the simple way I’m doing this in SVG it’s too slow to animate. I should rewrite it using Canvas to match the speed of the 2004 Java applet.

D3 makes this kind of visualization very easy. Particularly the projection; Ben’s online example uses a janky Platte Carrée, I imagine because he didn’t want to do the math. (The version in his book is more georesponsible.) I don’t want to do the math either, but with D3 I can just use the provided AlbersUSA. The source is on GitHub and is quite readable, I think.

  2013-02-24 00:13 Z