Easy way to build a county-focused clickable web map?

November 15, 2010 7:34 AM

Can you help me easily build a clickable web map centered on counties (in US)?

I work as a web developer in the US, and I'm wondering if anyone out there is aware of an easy way to build clickable county maps.

I have a big pile of data that is associated with counties in North Carolina. I would like to be able to display a map of North Carolina with counties. Ideally, when a user mouses over a county, the user might see the name of the county and some other limited data (like # of records in this county, etc). Clicking on the county would then let them view this data.

I have seen approaches to doing this that involve techniques like image maps, or (eyecch) Flash, and I'm curious to see if there is a tool out there that can do this easily that I am not aware of. Internets, can you help me?

Is there a feature buried in the Google Maps API or Open Street Maps that I'm not aware of? Thank you all!

posted by rachelpapers to computers & internet (6 answers total)

Seems like you are looking for something like this:

http://www.lib.k-state.edu/apps/kapi/kapi.php

which a developer who used to be here built on the basis of Google Maps .kml files. No Flash, just php. There is, alas, no documentation of which I am aware, but you might be able to gather some information from the code and the calls being made.
posted by dalea at 8:28 AM on November 15, 2010

What is your audience? If you are willing to forego support for non-bleeding-edge browsers, Polymaps might be a good bet. It's a library for displaying maps and data, but it's 100% future-focused and works only with new browsers.

If you're looking for broader support, OpenLayers might be a good bet. It's also a Javascript-based web mapping toolkit, includes many new features like SVG, but is also loaded with GIS jargon and surprisingly lots of coding overhead.

Both of these libraries will get you Javascript maps in the browser, and both include provisions for clickable vector overlays. Polymaps will have all the potential pitfalls of a three-month-old codebase, but the developer Mike Bostock (disclaimer: Mike is a friend and he was working with us at Stamen when he wrote Polymaps) is conscientious and helpful and often available to answer questions, so you might find it's a fun ride. OpenLayers has a much longer history and larger community, so you might find it easier to find help and if you're working with any GIS professionals they'll probably understand the language used in OL more readily.

I guess my two follow-up questions are: do you need the map to move when it's dragged, and do you know where you'll be getting your data from?
posted by migurski at 8:29 AM on November 15, 2010 [1 favorite]

My shop is working on a similar project right now using javascript and MooTools.
posted by Medieval Maven at 9:25 AM on November 15, 2010

@migurski

One of the things that I don't want to do is define all of those boundaries myself for the clickable vector overlays. I'm pretty decent at standard js-powered maps in the browser, I suppose I'm looking for a lazyweb way of automatically defining these counties.

This time the map does not need to be draggable, and my data is coming out an existing local solr index, so it can be in any form that it needs to be in to work with the mapping tool.
posted by rachelpapers at 7:29 AM on November 16, 2010

@rachelpapers if you're comfortable with the futureness of Polymaps, several of the demos offer tiled county boundaries demonstrating client-side styling and clicking. This one shows population.
posted by migurski at 5:56 PM on November 16, 2010

You can download all US county boundaries from the Census: http://www.census.gov/geo/www/cob/co2000.html

Mi company Flashmaps does offer a very cool counties map in Flash. You have the link to our website in my profile, if you prefer not to build it yourself.
posted by aribalaygua at 3:13 AM on November 21, 2010