brick.codes logo

Visualizations

Recently I've enjoyed playing around with some MassGIS Data - speficially, the MBTA Rapid Transit data as well as the census data, for city locations.

Here's what it looks like if we draw massachusetts: The entire state of Massachusetts, drawn from polygons mapping to each city

Now, let's zoom in and overlay the MBTA data: A chunk of the east coast of Massachusetts, with the MBTA subway routes drawn on top

We can calculate the voronoi diagram, and draw that as well: The same map of the MBTA subway routes, with lines composing a voronoi diagram drawn on top O(n log n) voronoi algorithms (such as Fortune's) are hard, so eventually I eneded up implementing a O(n2) algorithm which you can find described here.

We can use this diagram to generate a sort of heatmap, showing proximity to the nearest subway station: The same voronoi diagram, but each cell containing a radial gradient from warm to cool colors I'm still not happy with this visualization. I didn't want to draw the Voronoi diagram lines, but due to what I think are SVG rendering nuances, I couldn't get the gradients to line up perfectly, no matter how hard I tried. The voronoi lines serve to mask the edges.

Compression

It took me awhile to put this page up, because I wasn't happy with the size (in bytes) of the SVG files I was generating. This page would have been many megabytes more than it already is! I was able to use a combination of two things to get the size down

By reducing the number of bytes per point we are outputting and outputting far fewer points, we get a huge space reduction. If you'd like to see the svg files without the RDP algorithm applied, replace "lq" with "hq" in the URL path for the above SVG images.