Make Zip code boundaries in Google Map API

Question

I have seen all the responses to a similar question, however, they are all either old, or no one has answered them.

I have been given the task to obtain zip codes and display their corresponding boundaries to the user on a Google map, like in this example.

I am writing this code in Javascript and using the Google Maps API. I want the user to input a zip code and a marker drops down on their destination with a border representing that zip code area. I see that Google Maps currently has something in their map code that allows one to see the boundaries if someone puts a zip code on maps.google.com. I have used polygons but this wouldn't help make a border around a certain zip code.

Any suggestions on how to obtain this?

Thanks in advance!

Answer 1

There is not an easy answer to this that I know of. But here is a high level design of how to do it.

All of the shape files for zip codes can be found at the census site and can be downloaded from this ftp server. However, that's a ton of data, so you need a place to store it. I recommend using the PostgreSQL database with the PostGIS add on. It is free and open source and generally awesome. It has a utility for converting .shp files (the type in the census shape files) into PostGIS geometry form. PostGIS let's you retrieve the shapes back out as KML.

You can either a) retrieve a shape from the database as KML when it is needed and display it on the map or b) pre-generate a kml file for every zip code ahead of time and retrieve a file as it is needed (this would take up quite a bit of space).

Answer 2

You need to become familiar with GeoJSON formatted FeatureCollections. You can render them on any set of map tiles with OpenLayers (or probably Google API as well)

This may seem pretty hard, but is totally approachable.

You can purchase GeoJSON files for groups of Zipcodes if you search around.