Imagemaps at UVa


What are they?

Generally, we think of an HTML image map as an image along with some underlying structure that maps some region of the image onto a URL in response to an active mouse pointer.

The image map technique now in widespread use was developed in 1993 by Frans van Hoesel of Rijksuniversiteit Groningen for his WWW Expo project. An independent imapping scheme appeared almost simultaneously at a site developed by Kevin Hughes for Honolulu Community College. Modified forms of the initial ISMAP and MAPPER programs quickly found their way into subsequent releases of NCSA's HTTP server support software. Comparable versions appeared as well in the CERN server releases. Image mapping facilities now exist for most WWW servers.

In NCSA's HTTPd 1.5, imagemap functionality was brought into the server itself to enhance efficiency. The external feature, however, continues to be supported.


Imagemap Components

An imagemap consists of four components:


Map Specifications - General Form

SYNTAX : METHOD URL coordnate_pair(1) coordinate_pair(2) ... coordinate_pair(n)


How Do CS Imagemaps Differ From SS Imagemaps?

  • SERVER SIDE IMAGEMAPS:

    • The map specification is retained on the host. It is not passed to the client.

    • The mapped image is indicated by an ISMAP declaration that takes no arguments:

      <A HREF="/cgi-bin/imagemap/~name/some.map/">
      <IMG SRC="'image'.gif" ISMAP> </A>

    • The map file resides on the server host and must have the imagemap filename extension recognized by the server. On UVa hosts, the default map file extension is ".map":

      AddType text/x-imagemap .map

    • Here is the content of a simple map file:
      default http://curry.edschool.virginia.edu/\
      	~edsupp/sorry.html
      rect http://curry.edschool.virginia.edu 26,72 145,146
      circ http://www.novell.com/ 263,115 299,90
      poly http://www.extron.com/ 389,64 440,64\
      	 465,105 440,147 389,147 365,105
      
    • Notice the default reference above. This tells the server what URL to access if the user clicks outside the prescribed hotzones. For server-side imagemaps, the default specification should appear FIRST in the map specification file.

    • Notice also that coordinate elements must comma delimited and that coordinate pairs must be space delimited.

    • Hotzones may overlap! In cases of conflict, the hotzone specified FIRST in the mapfile will take precedence. Thus if one wihses to define a map consisting of a sequence of embedded hotzones, the smallest of these should be specified first, followed by the next smallest, and so on.

    • Two client-server transactions occur in accessing hypermedia documents tied to a hotzone.

  • CLIENT SIDE IMAGEMAPS:

    • The map specification is passed to the client.

    • The mapped image is indicated by a USEMAP declaration:

      SYNTAX : USEMAP="[URL]#"map_name"

      The argument tells USEMAP which map to use with the image. It must include a "#" and a map_name but may optionally include a fully qualified URL. If the argument begins with a '#', the map is assumed to be in the current document.

      The following are legimate USEMAP declarations:

      <IMG SRC="menu.gif" USEMAP="http://.../maps.html#map1">

      <IMG SRC="menu.gif" USEMAP="maps.html#map1">

      <IMG SRC="menu.gif" USEMAP="#map1">

    • The map specification MUST be placed within a named HTML MAP element that is embedded in either the host document or an external file:

      <MAP NAME="name">
      <AREA [SHAPE="shape"] COORDS="x,y,..." [HREF="reference"]
      	[NOHREF] [ALT="alt"]>
      </MAP>
      

    • Here is a typical example from the curry.edschool server:

      <IMG SRC="start2.GIF" USEMAP="#start2"> 
      <MAP NAME="start2"> 
      <AREA SHAPE="RECT" COORDS="26,72,145,146"
      href="http://curry.edschool.virginia.edu"> 
      <AREA SHAPE="CIRCLE" COORDS="262,110,42"
      href="http://www.novell.com"> 
      <AREA SHAPE="POLYGON"
      COORDS="389,64,440,64,465,105,440,147,389,147,365,105"
      href="http://www.extron.com"> 
      <AREA SHAPE="RECT" COORDS="0,0,499,212" href="sorry.html"> 
      </MAP> 
      

      Notice that ALL coordinate values are comma delimited.

    • Overlapping hotzones are permitted! As before, the hotzone specified FIRST in the map file will take precedence in cases of conflict.

    • To provide "default" capability, take advantage of specification precedence and define the entire image as a hotzone, placing its coordinates in the LAST position. Notice that this location requirement is the polar opposite of that used in client-side map files.

    • If the map specifications are contained within the same document as the associated IMG tag, only a single client-server transaction occurs in accessing the document linked to a hotzone.


    Which Technique Is Preferred?

    • Client-side mapping seems faster, is somewhat easier to set up and appears more readily adapted to Java and Javascript extensions.


    Both Techniques Are Supported Locally


    Additional References


Content last modified Thursday, 29-Aug-1996 11:09:49 EDT. Comments to jbb@virginia.edu