I saw an interesting talk by Sha Hwang and Zain Memon of Trulia, the real estate data company. They described a clever way to let a user manipulate a map visualization interactively in their client. I don't know of a demo to link yet, so please bear with the prose description.

Say you want to show a heat map of average home price by zip code. The traditional way would be to render a raster image (or tile set) on the server with each zip code coloured by price. Very efficient for the client, but you're stuck with a single visualization. Or you can overlay a bunch of vector polygons on top of a raster map: efficient, manipulable, but you are drawing complex shapes in the browser and it doesn't scale well.

A third way they described is rendering the zipcodes into a raster map, then repainting in the client. The basemap tiles don't look like much, a harlequin of colours. Yellow for 94114, red for 94117, black for 94121, etc. Then on the client, Javascript goes in and applies a colour map: turn all 94114 pixels orange (medium expensive), 94117 pixels red (very expensive), etc. The advantage is the colouring happens entirely in the client. The user can easily interact and try out different visualizations (say, convolving with crime rate) without going back to the server for new image tiles.

Sha had a great way to describe this idea: in their image tiles, the pixel colours do not represent the data values like price or crime rate. Instead they represent the data keys, the zip code, and then they join that key to various values in the client dynamically. It's a nice generalization of an idea I've seen various folks play around with (myself included).

I'm not aware of an online map yet using this technique but Sha said he thought the technique was fast enough to be practical for consumer use. I belive the easiest way to implement it would be using canvas. Unfortunately that's a poor match to the SVG implementations I've been favouring lately, but no doubt there's a way to make it work by embedding canvas elements inside SVG or the like.

Update: Trulia has now placed online a map that uses this technique. Compare: server-rendered, client-rendered. Inline below is an example zip code tile image.
  2011-04-16 01:40 Z