CODEWITHSUNDEEP
flashwordpressdictionaryinteractive
Rob
Rob

Reputation: 6380

Building an interactive map

I've been tasked with building an interactive map of all the states in the US and just wondering what the best way is to go about this?

I know I could build this fairly easily in Flash but one of the requirements is for it to work on an iPhone so obviously that rules Flash out!

Requirements:

  1. Must work across all browsers and handheld devices.
  2. Must be updatable via Wordpress.
  3. Must include a small info box that pops up when each state is hovered.
  4. The look of the map will be designed by us (we'd want complete control of this as we're graphic designers!) so this also rules out a custom Google map.

I've done a search on here and found two examples, the first is exactly the kind of thing we want but is done in flash - example

A suggestion was to use this but I don't think I'll be able to create popup bubbles when hovering over each state.

Does anyone know any alternatives?

UPDATE:

An example I like is - Transmit's feature section. How was this built and how could I recreate something like that?

Upvotes: 0

Views: 915

Answers (2)

CMoreira
CMoreira

Reputation: 1708

I know this thread is already a few months old, but in case people are still looking. I created a wordpress plugin that is able to do what you need. Check out an example of what you can do with it:

http://cmoreira.net/interactive-world-maps-demo/usa-custom-election-map/

It doesn't fit all your requirements, but it can be a good option also.

Upvotes: 1

tiktak
tiktak

Reputation: 1220

You can use the plain old <map> tag and put some javascript to show the popup.

(I think it's even possible to only use CSS. You create all the popups but don't display them. In the :hover part of each "US State", you make the corresponding popup appear.)

But there is a problem with your request: combining handheld devices compatibility and hovering is not possible!

It may be too much for what you want to do, but when dealing with maps (as long as you're not happy with a non-customizable Google/Yahoo/Microsoft map), I'd recommend OpenLayers. OpenStreetMap use it as well as other well-known websites.

Don't worry about the WordPress part. Of course you would save time if an existing plugin exists but I think this is the least important thing to consider. I coded a few hand made plugins for WordPress. It's really easy (compared to TYPO3 for example!)

Upvotes: 1

Related Questions