I need a web app that lets visitors choose regions of a map...

November 1, 2005 12:00 PM

I want to build/buy/hire someone to make something that lets visitors pick (multiple) geographical areas off a map. Something similar to this but better. Or, if you've got a better way to choose regions of a city that aren't a clickable map, what are they?

What's involved? Is it possible to use googlemaps to do something like this? Should it be done with Flash? Can it be done without Flash? Do I have to pay a map service or...wha?

I know absolutely nothing about what needs to be done--just what I need it to do. Are there companies that already do this that I can hire? Are there pre-made apps to do this? Can anyone here do this? About what is this going to cost me? I'd prefer it to be Canada-wide but even Ontario-wide (for now) may suffice.

What's the best way to proceed?

And, if you can think of a better way for people to choose regions of a city that aren't a map, what are they?

posted by dobbs to computers & internet (23 comments total)

Oh, and by "better", it would be great if the areas of the map (once down to a specific region) was click/dragable rather than predetermined by the program.
posted by dobbs at 12:12 PM on November 1, 2005

FWIW, I'm capable of doing what you're maps work, but I am currently booked solid. (Maybe in a couple weeks?)

The biggest issue, as I see it, is the definition of the clickable areas (polygons). You said that you might want something Canada or Ontario-wide - do you have the latitude/longitude information for all of the areas that you want selected? Or do you know where these polygons can be found?

The second biggest issue is the drawing of the polygons - if you're using Google Maps (which is, by far, the easiest to get up and running) - it's possible to draw polygon outlines, but nothing filled in. And even then, it's not very fast. Getting a reasonable, real-time, result would definitely require some trickiness.

I think some combination of a list of locations - and associated highlighted areas on a map - would be the best way to go.
posted by jeresig at 12:39 PM on November 1, 2005

The simplest way might be to usa HTML "image maps". They're pretty easy to set up if you have basic HTML knowledge.

First, you make an image (GIF, JPEG, or PNG) of the map, then you have to define the different regions in the HTML by specifying points in the image. Google for "HTML image maps" for lots of sites that tell you how to do this. There are also programs out there that let you select the regions graphically and will generate the HTML for you.
posted by Emanuel at 1:10 PM on November 1, 2005

Oh, the using technique I mentioned isn't going to make it very easy to select multiple areas, now that I re-read your post. But see http://www.mls.ca/ for an example of this technique in action, including the ability to select multiple regions.
posted by Emanuel at 1:14 PM on November 1, 2005

(oops, that link should be www.mls.ca)
posted by Emanuel at 1:15 PM on November 1, 2005

Thanks for the answers so far.

Emanuel, it has to have multiple areas clickable action. Image maps won't serve my purposes.

jeresig, the prob with predetermined areas associated on a map... I think you mean to have a list like "downtown, updtown, soho, etc. etc." and when the person clicks one of those the area on the map highlights. The prob there is that some regions do not have names in my city (or if the do, they're not well known) and some of the ones that do are huge and cover too much ground. In addition, I really would like people to be able to pick their own areas (I hate the predetermined areas in the example I linked, for instance, as they make little sense to me).

Please keep any answers coming.
posted by dobbs at 1:49 PM on November 1, 2005

Google Maps uses that png hack to give IE transparency, so I'd do the same for regions and overlay a dynamically rendered PNGs, with appropriate imagemaps.

I'd probably do that in one iframe and build up a checkbox list of regions in the parent frame with a 'view Xs in this region' button. Submit this list as db query and the rest is jam.

But mostly what you've got is complex interface requirements, not complex server-side logic, so look for someone who knows Javascript, Ajax -- preferably Google Maps. Because PHP makes this type of PNG generation easy I'd recommend a platform of PHP / Postgres (or MySQL). It might take a week to build and release for a good developer.

I don't know about Google Map's terms and conditions, and whether they'd allow this though.
posted by holloway at 2:00 PM on November 1, 2005

ImageMaps would serve the purpose, they're just hyperlinks. Return false on the onclick event and build a list of regions up in Javascript.
posted by holloway at 2:00 PM on November 1, 2005

You hate predetermined areas? So they get to make their own areas... they click a point on the map and it adds everything with 2 kilometers of that point or something?
posted by holloway at 2:03 PM on November 1, 2005

holloway, my prob with predetermined areas is that no matter who determines them in the first place, the next person may not agree with them. In the example given, for instance, I may want to live north of X but not north of Y. However, whoever made that map has made it impossible to be north of X but south of Y and in fact clicking X highlights as far north as Z. Does that make sense?

I was originally thinking they could just drag out a rectangle and everything inside would be good to go and they could do that multiple times... however, on reflection, that may not be such a hot idea either as each visitor will be "off" from every other visitor by a few pixels here or there which isn't good.

In your opinion, if I'm advertising to find someone to do this I'm looking for an interface designer who knows PHP/MySQL and Googlemaps? Where would I look for such a person?

jeresig, I do not have any latitude/longitude co-ordinates.
posted by dobbs at 2:57 PM on November 1, 2005

Well if they're dragging boxes that'll be hard to do in HTML -- you'll want Flash, and then you (so far as I know) couldn't use Google Maps.

With your own predefined regions though, you'll need a programmer good at Ajax-style Javascript and then a server-side language (php/some database).

An "interface designer" is typically a graphic designer with a bent on workflow and good UI, not a programmer.
posted by holloway at 3:13 PM on November 1, 2005

Is this kind of like what you're looking for? If so, have some free quirked-out badly structured and uncommented javascript courtesy your main man moift. If not, good luck. Works in firefox and ie, though not so hot in the latter without some tweaking. Opera won't work because it hasn't implemented transparency yet.
posted by moift at 6:12 PM on November 1, 2005

*in the css sense I mean, if Opera can do alpha transparent pngs that's another good option.
posted by moift at 6:14 PM on November 1, 2005

PS I'll take the project if you're offering a relatively astounding amount of money; it sounds like a pain in the ass :/
posted by moift at 6:33 PM on November 1, 2005

moift, that's sorta what I'm looking for except with the ability to select more than one area and the abillity to reclick on the area and have it unselect.

Define "astounding". :)

Perhaps I'll email you when the project is closer to the go stage (you too jeresig) and we can discuss if working together is possible.
posted by dobbs at 7:04 PM on November 1, 2005

the ability to select more than one area and the abillity to reclick on the area and have it unselect.

That's highly doable. The box thing is really not going to be a problem for anyone with a bit of JavaScript skill. The only issue I see here is generating the actual map... Would this site violate the Google Maps API TOS? Would the API even work? According to the FAQ, it doesn't offer any kind of "geocoding" or access to behind the map data, just images, so there's no way (that I know of) to get the users' selections into the database (no conversion from pixels to lat/lon). OpenGIS (sample implementations) may be a good alternative, but without having looked into it too deeply it seems like it'd require some really substantial coding (especially since none of the php projects appear to be active or working correctly).

If this is going to be a high traffic site you'll almost certainly want to get an on-site database so you're not at the mercy of whoever's running the servers of the distributed systems, (at least if they're not google) and that is going to cost you. If it's not so critical, maybe there's another solution out there. Hopefully someone who knows more about the various mapping systems will report in before this thread dries up.
posted by moift at 7:55 PM on November 1, 2005

Sorry about all the parentheticals, that was a little silly :]
posted by moift at 7:56 PM on November 1, 2005

I don't know where you sit in this whole deal, but from a business side of things, if the names and clear definitions of the different areas don't now exist, I think there's a value add for you to define them. So using a less flexible approach might actually have some real benefit.

Being the company to define a market - or to redefine it - can give you an advantage. It might seem unlikely, but having moved to Ottawa recently after having been away for over 15 years, all kinds of areas have names and definitions that they didn't have when I left, and those names have come along with a great deal of development.
posted by mikel at 8:18 PM on November 1, 2005

moift, I assume that if I use predefined areas (instead of dragable ones) then something like this (if you have the map) is very easy for you to dump the clicked results to a database. Is that correct?

Imagine that I'm building a service very similar in function to the site I linked (a real estate listing service). That would be my end-goal.

mikel, I understand what you're suggesting but it's outside of the scope of what I want to do. Plus, naming the areas works well when you're working on a small scale but if I want the end app to be expandable and simply depend on what I have maps for, naming areas isn't feasible. I mean, I know the names of regions for Toronto, but for anything outside of that, even in Canada, I'm lost. Go beyond Canada and it's worse. I think if you just have a map that people can click (they'll--for the most part--know where they want to move), you're gravy bound.
posted by dobbs at 8:59 PM on November 1, 2005

Anything you can get from the UI to lat/lon is easy to get in the database. If you have a predefined area with associated coordinates you can still do dragable stuff and just triangulate missing coordinates. You just need a some sort of system to relate the map to the territory.
posted by moift at 9:13 PM on November 1, 2005

a
posted by moift at 9:14 PM on November 1, 2005

triangulate missing coordinates
er well you could estimate well enough probably, triangulate isn't the right word.
posted by moift at 9:20 PM on November 1, 2005

oh wait you can triangulate in that situation. For some reason I was thinking you could only get two angles, but then the whole point of triangulation is that having two gets you third free. I'm going to chalk that one up to sleep deprivation.
posted by moift at 9:55 PM on November 1, 2005