Tue - Sat, 12 - 6PM / 212.937.6580 / 540 W 21st St. New York, NY 10011
Google Maps for Browsing Collections
The V&A just released a great beta of their collection search. I really like the jQuery Wall they’ve provided for browsing the collection – it’s an (apparently) infinite canvas of objects from the V&A collection with a movable viewport. The SFMOMA ArtScope does something similar, but I imagine the Wall could be a bit more flexible and maybe a bit quicker loading once some of the interaction lag gets ironed out (maybe some added visual interaction cues as well?). Looking at these reminded me of two tools that help in making tilesets of large images for use with Google Maps.
I collected the enlarged images of the 100 Modern department highlights (these are width limited to 500px with a variable height), made a 10 x 10 contact sheet in Photoshop, and had the Image Cutter break down the resulting 5,000 x 8,000 pixel image. Allowing for zooming down to level 7 on the Google Map took 5,461 256 x 256 pixel tiles.
I combined the automatically generated Image Cutter Google Maps code with a few functions to load markers from an XML file. I collected the URL for each highlight with a quick processing sketch. It took some trial and error to figure out how to place the first few markers but the uniform spacing helped once reference points were set.
This simple Google Maps solution isn’t nearly as dynamic as either the V&A Wall or the SFMOMA ArtScope, but I like how it has the potential to move quickly between giving a broad overview of the collection, to showing details-on-demand, and then providing multiple detail or high resolution images all in a single interface.
//TODO: Polygon overlays could be used instead of markers to make an entire collection object clickable. More information could be added to the tooltips – I was having trouble with special characters in XML CDATA.