How difficult would this be to do? (Image map)

aimeeandbeatles · Nov 16, 2011, 09:24 PM

On my site I have a list of items, sorted geographically. It's getting kind of long and I was considering splitting it up. My friend suggested I make an image map of the world and you click on a country.

How hard would this be to do? Here's a couple things to take in mind:

1. The website is fixed-width. So it can't really be that wide. This might be an issue with some of the smaller countries. On the current page I have the countries sorted by regions. That might be easier. Right now, the largest "region" is the United States. (I do each state individually.)
2. Also, it needs to be easily "upgraded." Meaning I can add more links later on if needed. Of course if I do it by region I could just add them ahead of time.
3. One last idea that I had: What if the world maps let you click on regions, and then from there you could click on the countries individually?
4. Keep in mind this is WordPress.

What are your suggestions? Is it worth a shot? I'm not real good at coding or anything but once in a while I can wrap my brain around it.

I googled it and I dont really see any pre-made ones but if someone knows of one send it along.

BandC · Nov 17, 2011, 06:02 PM

This depends heavily on your web site layout, how much space you can dedicate to the image map, how many points or areas will be on the map, etc. If you don't have much space and/or you have a lot of points it will look bad. If that's the case, I would just go with a Javascript expanding text link list (continents -> countries maybe) instead of an image map.

Here's an implementation of a world image map: http://www.alistapart.com/articles/cssmaps/

Another option may be using Google Maps and markers. Either of these approaches will require some programming though.

aimeeandbeatles · Nov 17, 2011, 08:24 PM

That looks neat. If you want to see the width Ive got to work with there's a link in my signature. That map on the link I think is a little too small but I could probably find one that I can use.

warpus · Nov 18, 2011, 01:02 PM

If you have programming skills, check out raphael

related example

Mise · Nov 19, 2011, 07:01 AM

Have you tried putting pins onto Google Maps?

Tutorial here: http://www.wikihow.com/Create-a-Goog...-Fusion-Tables

Nov 16, 2011, 09:24 PM	#1
aimeeandbeatles watermelon Join Date: Apr 2007 Location: Aperture Science Laboratories Posts: 12,143 Images: 10	How difficult would this be to do? (Image map) On my site I have a list of items, sorted geographically. It's getting kind of long and I was considering splitting it up. My friend suggested I make an image map of the world and you click on a country. How hard would this be to do? Here's a couple things to take in mind: 1. The website is fixed-width. So it can't really be that wide. This might be an issue with some of the smaller countries. On the current page I have the countries sorted by regions. That might be easier. Right now, the largest "region" is the United States. (I do each state individually.) 2. Also, it needs to be easily "upgraded." Meaning I can add more links later on if needed. Of course if I do it by region I could just add them ahead of time. 3. One last idea that I had: What if the world maps let you click on regions, and then from there you could click on the countries individually? 4. Keep in mind this is WordPress. What are your suggestions? Is it worth a shot? I'm not real good at coding or anything but once in a while I can wrap my brain around it. I googled it and I dont really see any pre-made ones but if someone knows of one send it along. __________________ Note: I'm female. Don't forget that. \| The Petty Archives \| Let's Play: Portal 2 "When he goes to bed at night, Chuck Norris checks under his bed for aimeeandbeatles." -- choxorn

Nov 17, 2011, 06:02 PM	#2
BandC Chieftain Join Date: Dec 2010 Posts: 35	This depends heavily on your web site layout, how much space you can dedicate to the image map, how many points or areas will be on the map, etc. If you don't have much space and/or you have a lot of points it will look bad. If that's the case, I would just go with a Javascript expanding text link list (continents -> countries maybe) instead of an image map. Here's an implementation of a world image map: http://www.alistapart.com/articles/cssmaps/ Another option may be using Google Maps and markers. Either of these approaches will require some programming though. __________________ IMHO PT OP. BTW RA WAD? FWIW. HTH. AFAIK YMMV. OMG WTF BBQ! Do you like surfing game forums but wish people would stop using obscure abbreviations and gaming acronyms? Then my Firefox/Chrome extension ABBREX is for you! It automatically adds hover tooltips to abbreviations displaying their meanings on any web page you visit! Check it out at: http://abbrex.com Read about it in my post here

Nov 17, 2011, 08:24 PM	#3
aimeeandbeatles watermelon Join Date: Apr 2007 Location: Aperture Science Laboratories Posts: 12,143 Images: 10	That looks neat. If you want to see the width Ive got to work with there's a link in my signature. That map on the link I think is a little too small but I could probably find one that I can use. __________________ Note: I'm female. Don't forget that. \| The Petty Archives \| Let's Play: Portal 2 "When he goes to bed at night, Chuck Norris checks under his bed for aimeeandbeatles." -- choxorn Last edited by aimeeandbeatles; Nov 17, 2011 at 08:27 PM.

Nov 18, 2011, 01:02 PM	#4
warpus pork strike force Join Date: Aug 2005 Location: Stamford Bridge Posts: 30,992	If you have programming skills, check out raphael related example __________________ My New Zealand thread with photos of New Zealand

Nov 19, 2011, 07:01 AM	#5
Mise isle of lucy Join Date: Apr 2004 Location: London, UK Posts: 25,264	Have you tried putting pins onto Google Maps? Tutorial here: http://www.wikihow.com/Create-a-Goog...-Fusion-Tables __________________ Come to fiftychat! It's where downtown hangs out!

Powered by vBulletin® Copyright ©2000 - 2013, Jelsoft Enterprises Ltd. This site is copyright © Civilization Fanatics' Center.
Support CFC: Amazon.com \| Amazon UK \| Amazon DE \| Amazon CA \| Amazon FR