Hi guys,

 

I'm about to take on quite a big project for a client who requires all sorts of Web-related work, but within this he needs an interactive map.

 

The map

 

Basically he is going to obtain the floor plans of a large campus and get a freelancer to design a huge map based on the floor plans. Once I eventually get my hands on the digital version of the map, which will probably come in the form of a PSD/AI or even a jpeg, I will need to incorporate it onto the Web site.

 

The functionality

 

In terms of interactivity, the user needs to be able to zoom in and out of the map. There is no other extra functionality apart from that, so I'm hoping that this is quite straight-forward. However, I will also be building a search engine for the client in which users will be able to search for certain keywords. The search results displayed will be links to different hotspots on the map, which I'm guessing I would create an image map for?

 

The problem

 

Databases and back-end code is not really what I do, however, I have done a lot of back-end coding and like to take on a challenge, as I'm sure I will eventually be able to achieve what I intend.

 

So where I'm stuck is just how exactly I will approach this interactive map. It seems that building the map and its interactivity shouldn't be too difficult, but I'm not entirely sure how I can build it in a way for each of these hotspots to be found using a search-engine. I assume that in the database I will obviously have all of my possible keywords (so the different room numbers/names) and then in each keyword's row there will be a field with a url to the page displaying the map with the relevant hotspot displaying. The question is how I tell it to display specific hotspots depending on the URL, and not just display ALL of the hotspots.

 

An example may make things easier to understand:

 

- User searches utilities room

- In the database the search engine searches for keywords matching 'utilities'

- In the same row as the keyword 'utilities' there is a URL

- So when presented with the search results, the user is shown this URL

- User clicks URL and is taken to the page displaying the interactive map

- On the interactive map there is one hotspot showing them where the utilities room is

 

The other challenge is making this whole idea usable on the mobile Web, as this is a very important feature.

 

But some advice would be great, as I've not really dived into this area before..

 

Cheers,

 

Ash

I think you'd be better off splitting the "map" into separate areas/records. That way you will be able to link to any part or combine all parts to form a complete map.

 

If the idea is for users to locate specific rooms then here's how I would structure it:

 

Records/entries for each room

- include custom fields for descriptions, images and other data

- if you use one large image for the map include custom fields for x/y co-ordinates so you can plot each location

 

Category based system for grouping rooms

- this would mean you could easily extract say a whole building, or all rooms within a building

 

The map

- could use one large map and add location markers based on what records need to be show

- could use several map images taken from rooms data, then just display as a grid (as Google maps do)