Interactive Map in HTML

**Jeremy J Starcher** · Jun 27 '08, 07:16 PM

Re: Interactive Map in HTML

On Fri, 06 Jun 2008 06:39:26 -0700, vunet wrote:

How to make an interactive map without Flash? I want to move mouse over
each continent and see it changing its color but when clicked it would
send some action to the DOM.
>
Someone offered me to make a few images with each continent highlighted
and when user moves mouse over a different continent, a new image is
replacing older one (with another continent highlighted). The map would
have coordinates linked in <AREAtag.
>
To me this does not seem to be a great solution. Though I do not know of
any alternatives yet. Did anyone have an experience with it? Can you
recommend a method of implementing continent interactive map as
described above or feedback above solution?
>
Thanks.

Google for the phrase "HTML image map" and that will get you started.

Though image maps CAN be made by hand, most prefer some sort of map-
editing software. Don't have any I can recommend though -- I use custom
software because I had some very specific needs.

**vunet** · Jun 27 '08, 07:16 PM

Re: Interactive Map in HTML

On Jun 6, 10:06 am, Jeremy J Starcher <r3...@yahoo.co mwrote:

On Fri, 06 Jun 2008 06:39:26 -0700, vunet wrote:

How to make an interactive map without Flash? I want to move mouse over
each continent and see it changing its color but when clicked it would
send some action to the DOM.

>

Someone offered me to make a few images with each continent highlighted
and when user moves mouse over a different continent, a new image is
replacing older one (with another continent highlighted). The map would
have coordinates linked in <AREAtag.

>

To me this does not seem to be a great solution. Though I do not know of
any alternatives yet. Did anyone have an experience with it? Can you
recommend a method of implementing continent interactive map as
described above or feedback above solution?

>

Thanks.

>
Google for the phrase "HTML image map" and that will get you started.
>
Though image maps CAN be made by hand, most prefer some sort of map-
editing software. Don't have any I can recommend though -- I use custom
software because I had some very specific needs.

Thanks. I understand the solution I described is a part of your
suggested Google search for "HTML image map".
I am considering...

**Jukka K. Korpela** · Jun 27 '08, 07:16 PM

Re: Interactive Map in HTML

Scripsit vunet:

How to make an interactive map without Flash?

In pure HTML, you can set up a client-side image map, which apparently
has been suggested to you. Using HTML and server-side scripting, you can
set up a server-side image map, though it's usually an inferior solution
for selecting between areas (opposite to selecting an arbitrary point).

I want to move mouse
over each continent and see it changing its color but when clicked it
would send some action to the DOM.

The first part is difficult. The second part ("when clicked - -") is
basic functionality of client-side image maps, except that a click
primarily sends the browser to a specific URL, but you can add to this,
or override this, by an onclick="..." attribute on an <areaelement.

Someone offered me to make a few images with each continent
highlighted and when user moves mouse over a different continent, a
new image is replacing older one (with another continent highlighted).

That's possible. You could have an onmouseover=".. ." attribute in an
<areaelement, and the script invoked could e.g. change the image.
Unfortunately, it is no possible to change just the area; you would
indeed need to change the entire image to a variant that has the area
highlighted.

The map would have coordinates linked in <AREAtag.

Yes, and technically the area would be described as a polygon, coarsely
or smoothly, depending on how many points you care to include there.

To me this does not seem to be a great solution.

It's not, but it works, with some caveats, and it's used on many pages.

--
Jukka K. Korpela ("Yucca")

http://www.cs.tut.fi/~jkorpela/

**vunet** · Jun 27 '08, 07:16 PM

Re: Interactive Map in HTML

On Jun 6, 12:44 pm, "Jukka K. Korpela" <jkorp...@cs.tu t.fiwrote:

Scripsit vunet:
>

How to make an interactive map without Flash?

>
In pure HTML, you can set up a client-side image map, which apparently
has been suggested to you. Using HTML and server-side scripting, you can
set up a server-side image map, though it's usually an inferior solution
for selecting between areas (opposite to selecting an arbitrary point).
>

I want to move mouse
over each continent and see it changing its color but when clicked it
would send some action to the DOM.

>
The first part is difficult. The second part ("when clicked - -") is
basic functionality of client-side image maps, except that a click
primarily sends the browser to a specific URL, but you can add to this,
or override this, by an onclick="..." attribute on an <areaelement.
>

Someone offered me to make a few images with each continent
highlighted and when user moves mouse over a different continent, a
new image is replacing older one (with another continent highlighted).

>
That's possible. You could have an onmouseover=".. ." attribute in an
<areaelement, and the script invoked could e.g. change the image.
Unfortunately, it is no possible to change just the area; you would
indeed need to change the entire image to a variant that has the area
highlighted.
>

The map would have coordinates linked in <AREAtag.

>
Yes, and technically the area would be described as a polygon, coarsely
or smoothly, depending on how many points you care to include there.
>

To me this does not seem to be a great solution.

>
It's not, but it works, with some caveats, and it's used on many pages.
>
--
Jukka K. Korpela ("Yucca")http://www.cs.tut.fi/~jkorpela/

thank you.

Interactive Map in HTML

Interactive Map in HTML

Comment

Comment

Comment

Comment