HighDots Forums  

Interactive Map in HTML

HTML Writing HTML for the Web (comp.infosystems.www.authoring.html)


Discuss Interactive Map in HTML in the HTML forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
vunet
 
Posts: n/a

Default Interactive Map in HTML - 06-06-2008 , 08:39 AM






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 <AREA> tag.

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.

Reply With Quote
  #2  
Old   
Jeremy J Starcher
 
Posts: n/a

Default Re: Interactive Map in HTML - 06-06-2008 , 09:06 AM






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

Quote:
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 <AREA> tag.

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.


Reply With Quote
  #3  
Old   
vunet
 
Posts: n/a

Default Re: Interactive Map in HTML - 06-06-2008 , 10:14 AM



On Jun 6, 10:06 am, Jeremy J Starcher <r3... (AT) yahoo (DOT) com> wrote:
Quote:
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 <AREA> tag.

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...


Reply With Quote
  #4  
Old   
Jukka K. Korpela
 
Posts: n/a

Default Re: Interactive Map in HTML - 06-06-2008 , 11:44 AM



Scripsit vunet:

Quote:
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).

Quote:
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 <area> element.

Quote:
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
<area> element, 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.

Quote:
The map would have coordinates linked in <AREA> tag.
Yes, and technically the area would be described as a polygon, coarsely
or smoothly, depending on how many points you care to include there.

Quote:
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/



Reply With Quote
  #5  
Old   
vunet
 
Posts: n/a

Default Re: Interactive Map in HTML - 06-06-2008 , 04:16 PM



On Jun 6, 12:44 pm, "Jukka K. Korpela" <jkorp... (AT) cs (DOT) tut.fi> wrote:
Quote:
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 <area> element.

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
area> element, 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 <AREA> tag.

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.


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.