Posts Tagged ‘zach’

Value-by-Alpha Maps, Cartograms, and More (Cartogrammer)

Thursday, June 17th, 2010

cartogramcube

[Editor's note: Best practices on accounting for area-distortions normally present in conformal map projections by using cartograms and value-by-alpha alternatives. Check out the paper. Thanks ChartPorn!]

Republished from Cartogrammer.

The latest issue of the The Cartographic Journal (of the British Cartographic Society) contains a paper written by Robert Roth, me, and Zachary Johnson entitled “Value-by-alpha Maps: An Alternative Technique to the Cartogram.” The value-by-alpha map is something I have touched on here several times over the past year and a half (as has Zach on his blog), and about which I spoke at last year’s NACIS conference in Sacramento. With the publication of this paper, it’s high time I explained what it’s all about.

Value-by-alpha maps (hereafter shortened to VBA), like everything noble and good, have their roots in somebody complaining about something on the internet—me, about election cartograms. Seeking an alternative to what I think are ugly and unreadable election results cartograms, I worked with my Axis Maps dudes to create a 2008 U.S. election map that used transparency rather than size to vary the visual impact of map units, thinking that avoiding the distortion of these units into unrecognizable sizes and shapes would make the map easier to read.

Rob Roth, a stellar Ph.D. candidate and shameless county collector at Penn State (studying under The Beard himself, the illustrious Alan MacEachren) became interested in further developing the idea academically and enlisted my Axis Maps partner and radical raw milk zealot Zach Johnson (who wrote his master’s thesis on cartograms) and I to collaborate on the now-published Cartographic Journal article. We were all graduate students at Madison together once upon a time, and we make a good team—striking a perfect balance between study, practice, and chili-eating.

Enough backstory. I’ll summarize at moderate length the idea and what we wrote.

Continue reading at Cartogrammer . . .

Nightingale’s roses in ActionScript 3 (indiemaps)

Tuesday, November 11th, 2008

[Editor's note: Zach Johnson demonstrates how to create animated coxcomb charts in Flash/Flex AS3.]

Republished from IndieMaps.org.

[Zach has] long been a sucker for the polar area/coxcomb/rose charts popularized by Florence Nightingale. These multivariate charts can show ordered or unordered categorical data. As noted in an Economist piece on influential information graphics,

As with today’s pie charts, the area of each wedge is proportional to the figure it stands for, but it is the radius of each slice (the distance from the common centre to the outer edge) rather than the angle that is altered to achieve this.

I wanted to produce some just for kicks, so looked around for a script in AS3. No dice. OK, any language? Didn’t see anything. So I sat on the idea for a while and then finally thought up the technique that made producing them in AS3 quite easy. With the resultant classes, producing graphics like the following small multiples of U.S. soldier deaths in Iraq is a snap. The classes are written in AS3, so can be used with Flash, Flex, or mxmlc. All the example screenshots below are PNGs captured from SWFs produced with only AS3 (extended Sprites). To see the code (which includes a lot of ugly annotation), click ‘view source‘ below any image. All source code is included in the ZIP distribution linked below.

(more…)

SpatialKey: insanely good geovisualization (indiemaps)

Wednesday, September 3rd, 2008

[Editor's note: More on commercial Spatial Key visualization system for Flash from Zach Johson via Universal Mind.]

Reprinted from indiemaps blog on 13 Aug. 2008.

I’m [ed-Zach Johnson] a little late on this, so I hope it’s old news to most readers that Universal Mind, where I’ve worked for the past 2 months, just launched a technology preview of theSpatialKey visualization system.  This is a big deal.

Andrew PowellDoug McCune, and Brandon Purcell have already posted great introductions to SpatialKey, so I won’t go through all that here. But just so’s you know: SpatialKey is a visualization system for geotemporal (location + time) data, developed primarily in Flex, that lets you filter and render thousands of points very quickly, all client-side in your browser.

This is not a formal release. We’re in a technology preview for now, which means you just get to see some sweet examples, but soon we’ll release a version, SpatialKey Personal, into which you can load and visualize your own data. Here are links to three of my favorite examples (for more, check out our Gallery page, or this post on the SpatialKey blog).

As I said, other better introductions have been written on SpatialKey; I just want to focus on a few of my favorite features or attributes.

not a single, do-it-all application

SpatialKey is based around a collection of visualization templates. Each offers a unique view of the data, with specialized visualizations, filters, and UI controls. Since the templates are specialized, each one is pretty easy to learn and begin using.

The examples linked above demonstrate the animationmap comparison, and drill down templates. The fourth template we’re showing off now is the temporal heat index template (here’s an example of that: Sacramento residential burglaries).

chorodot symbolization

You don’t see these much, but I think they’re really effective. The “heat grid” symbolization in SpatialKey is a modern implementation of a technique put forth by Alan MacEachren and David DiBiase in 1991.

Aggregating points to arbitrary but regularly-shaped polygons, or binning, was an extant graphical practice at the time, but the geographic application and their particular methods created an effective cartographic symbology. Other than SpatialKey, I haven’t seen this symbolization in a geographic visualization context, but I think it’s very effective at presenting large datasets that require aggregation. The heat grid symbolization in SpatialKey extends the approach by allowing grid renderings of attributes of the data (like house prices or temperature) in addition to aggregation of the count of points.

chorodot of AIDS cases in Pennsylvania

MacEachran and DiBiase’s example chorodot map of AIDS in Pennsylvania (image from J.B. Krygier’s lecture notes)

grid symbology in SpatialKey, implementation of the chorodot cartographic symbology

SpatialKey grid symbolization showing a data attribute (average home prices) in Sacramento county

small multiples / map comparison

I’ve always been a fan of the small multiples depiction of change, illustrated so well by Edward Tufte in The Visual Display of Quantitative Information and Envisioning Information. Though the SpatialKey Map Comparison template shows two multiples, it qualifies (and we can easily plug in more maps for specialized templates).

D.C. construction in the SpatialKey Map Comparison template

Both the maps and the time charts are live-linked. Mousing over an area on one of the maps or a bar on one of the time charts reveals the tooltip for both displays, allowing you to easily retrieve specifics for different time periods or areas.

complex temporal filtering and focusing via the heat index chart

The time chart, shown in the first screenshot above, is great for revealing linear temporal trends in a dataset, and for enabling linear filtering. But some datasets evince more complex temporal trends — for example, some crimes may be more common on a certain day of the week and at a certain time of day. Such trends are lost when data is aggregated in a linear fashion to, say, days or weeks.

sex crime arrests in Sacramento

The temporal heat index chart reveals such complex trends and allows filtering by multiple temporal aspects simultaneously (for example, showing only prostitution arrests on Tuesdays between 3 and 4 am).

in closing

I was late to the game on this one, joining Universal Mind in June. SpatialKey was developed by the brilliant team of Doug McCune, Ben Stucki, and Andrew Powell, led by Brandon Purcell and Tom Link, with product manager Mike Connor. It’s a privilege working with such a talented crew.

Our goals for this technology preview are modest (blowing minds, getting feedback), but we’re excited to continue developing SpatialKey and SpatialKey Law Enforcement. And we’ll be releasing updates, new examples, and SpatialKey Personal in the near future. So stay tuned to the SpatialKey blog, and please contact us if you have any feedback on our technology preview.

GBIF data heat maps – Heat maps over Google Maps for Flash (Biodivertido)

Wednesday, September 3rd, 2008

[Editor's note: Fascinating proof-of-concept for how to create and display heat-maps in Google Maps for Flash/Flex AS3 using PHP back-end for calculation and Flash for front-end. More information for using Google Maps in Flash CS3 download and reference and tutorial. Similar to some nifty work Zach Johnson is working up at Universal Mind for spatialkey.com.]

Reprinted from Biodivertido.

Maps like everything else seems to be trendy. And nowadays the sexy thing in mapping is the creation of Heat Maps. The best way to understand what they are is to see them:

You can also take a look at this post from one of my favorite blogs on what is and what is not a heat map.
Well for long time I wanted to give it a try and yesterday I had the time to experiment a bit. The idea was to display GBIF available data as a Heat Map over Google Maps. Here you have an screenshot for Quercus ilex:
And if you want to try for yourself here it is (some usability issue, the search box is on the bottom right corner):
So how does it work? It was actually easier than I expected:
1) Get the data: I am using the so called “Density tables” from GBIF. You can access them through GBIF web services API at http://es.mirror.gbif.org/ws/rest/density . For example in a query like this one for Quercus ilex (of course you need to get the taxonconceptkey from a previous request to the services): 
This works fine but has some problems. The first one is that GBIF goes down almost every evening. Tim can maybe explain why. Thats why I am using the spanish mirror (look at the url) and I recommend you to do the same.
Second problem is the verbosity of the XML schema being used. For downloading the Animalia, well thats the biggest concept you can get probably, the result is 14.1 MB of XML. And thats just to get a list of cellIds (if anybody is interested we can post details about CellIds) with counts on them, exactly an array of 34,871 numbers. Even worst is handling them on a web client like this one, parsing such a huge xml output kills the browser. The GBIF webservices API deserve its own blog post I would say together with Tim.
But what is new is that I have supercow powers on GBIF :D I am working for GBIF right now and have access to a test database. In a testing environment I developed a little server app that publish the same density service but using theAMF protocol. I used AMFPHP for this if anybody is interested. There are two good things about using AMF: The output now is around 150 KB for the same thing and AMF is natively supported by Flash so there is no need to be parsed it goes straight into memory as AS3 Objects.
2) Create a Het Map from the data: Once the data is on the client I make use of a Class from Jordi Boggiano called HeatMap.as that creates Sprites as the result. In my case I decided to create a Spring, think like an Image, of 1 pixel per cellId creating a 360×180 pixel image (cellId is equivalent to a 1 degree box).
3) Overlay the image on Google Maps: When you have the Sprite, or even earlier but thats too many details, what you do is overlaying in Google Maps for Flash using a GroundOverlay object that takes care of the reprojection and adapting it to the map. The GroundOverlay is explained in the doc as a way to overlay images but it accepts actually any Sprite.
Done! (almost)
4) Ok, there are some problems: Yes, it is not perfect, these are the pending issues:
  • The GroundOverlay seems to not be reprojecting correctly the Sprite I generate and in the very north and south everything is not correctly overlayed.
  • The resolution of the Heat Map is a little bit poor, bu actually represent the quality of the data we have. Some interpolation could be done to make it look nicer.
  • The colours of the Heat Map do not fit well with the actual Google Maps layers. When there is small data then you can not see it almost.
I still dont feel confident with the code to release it yet. I hope I can work a little bit more on it so that i can be proud, but if you desperately need it let me know.
Just another notice. Yesterday Universal Mind released a preview of a new product: Spatial Key. I am always impressed with what this people does and follow the blogs from their developers (like this one and this one). They are kind of my RIA and web GIS heroes. The new product they have released actually look very much like what I wanted to do in Biodiversity Atlas for data anlysis. It lets people explore geographically and temporally huge datasets. Tim suggested me to contact them and I will do. Nevertheless it is great to have such a great tool available to get ideas on interaction design. Good job Universal Mind, you really rock.
We want to see your comments!
Update: 
Some people asked for different quality settings on the heat map. I have modified the application so that you get now a set of controls to define different quality and drawing options. By default the app tries to figure out depending on the number of occurrences, but maybe thats not the best, depends on how the data is dsitributed. In a final product I think I would NOT provide this functionality to the user, too much for my taste. You know, less is more.