Creating a map of United States and counties with rollovers

I am looking to making an image map that will allow for rollovers, but the kicker is that when the user rolls over a State, only that state image changes, not the entire image, therefore I don’t have to expect the user to load a ton of images.

I have an example I did, but it replaces one 600px image with another.  Roll over Texas.
http://www.discipledesign.net/clients/m3iworks/vector_unitedstates_eachst.html
To do this I used an EPS Illustrator file exported to Image Ready.

One example of what I want to do is found at
http://www.copperstationproperties.com/property/statemap.aspx?nid=1518&state=texas

I am looking for a program that will do this and can be used repeated as I have to do all the counties in 6 states.

Thanks.
jason94024Asked:
Who is Participating?
 
billmercerCommented:
I suggest you take a look at MapServer
  http://mapserver.gis.umn.edu
It's an application that is specifically designed to take GIS data and render it to web-friendly formats.

Here's an example of an interactive web map created from GIS data using this system.


http://maps.dnr.state.mn.us/cgi-bin/mapserv48?map=/usr/local/www/docs_maps/eco/rsg/search/search_example.map&qlayer=county&mode=nquery&searchmap=true
0
 
lherrouCommented:
Jason94024,

There are a number of ways you could go about this, with Flash, rollovers, etc. The fastest, easiest way I can think of would be to produce your map of the states, as you have, and place it as a background image. Then, using an imagemap, do rollovers for the states you want to highlight, swapping a transparent image for one that's all transparent except the state you are highlighting. That should make your image sizes much smaller, except for the background image. You might also use a bit of Javascript to pre-load the rollover images so there's no delay when they put their mouse over the state.

Cheers,
LHerrou
0
 
psyki_beCommented:
The easiest solution for me would be Flash.
However, it's also the most expensive, and well, if you've never tried flash, it'd be a though first-time job.

Why would I use Flash?
Flash doesn't have the 'rectangular problem'.
If you want to use roll-over images, you can only use rectangular area's, right?
So, if you try 2 states next to eachother, it's possible you'll get a wrong one if you roll-over the border.
Flash doesn't have that.
0
Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
billmercerCommented:
> Flash doesn't have the 'rectangular problem'.
> If you want to use roll-over images, you can only use rectangular area's, right?

Er, wrong, actually. You can use <imagemap shape="polygon">. In fact, that's what the example the asker provided does. I don't think he wants a different medium, I think he wants a way to streamline the process of generating the maps, which in this case probably means some sort of GIS-based solution.


 


 

0
 
psyki_beCommented:
hmmmz, you're right :o

Meh, imagemaps, don't really sue 'em a lot.

Well, uurhm, forget my previous comment.
Allthough, if I had the right images (and knew how to put those states together), I could make this in Flash in 15 minutes...
Way easier, but, indeed, not the question.
0
 
billmercerCommented:
If you happen to have ArcInfo/ArcGIS, or know someone who has it, this might be handy.
  http://www.ecy.wa.gov/services/gis/apps/imagemap/imagemap.htm#req 
It's a set of scripts to generate imagemaps from GIS data automatically.

Or you could always cough up $300 for MapPoint...

 
0
 
MereteCommented:
Have  any of you tried google earth? Its wonderful
so this gave me the idea that
Google also has map creators
Google Map Creator makes thematic mapping simple
http://googlemapsmania.blogspot.com/2006/12/google-map-creator-makes-thematic.html

A really simple tool to make your own google maps to add to your website.
http://mapmaker.donkeymagic.co.uk/

hope they help you and they a free too.

0
 
MereteCommented:
jason94024  your post is now last year :)
 any feedback on your progress  or have you abandoned us?
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.