How to make a simple Image map

1. Create your html file such that the following statement is included:

   < IMG src="XXX.gif" usemap="#Z.gif" border="0"> </A>

   This tells your browser that this is an image map, and that the map name is Z.gif.

2. include the map file, which may even be in the same web page:

   < map name="Z.gif">
   < area shape="circle" coords=" 70, 45,6" href=" 1.html">
   < area shape="circle" coords="181,530,6" href=" 2.html">
   < area shape="rect" coords= "97,104,185,191" href="3.html" > < area shape="poly" coords= "197,104,297,104, 147,154," href="4.html" > ... etc
   < /map >

   In this case it tell us the shape of the region, x, y coordinates (in pixels of the GIF image) and radius. Finally, it tells you where your browser should jump to. There are other possible shapes such as rectangles shape = "rect" ( specify top left/bottom right ) and polygons shape = "poly" - a series of coordinate pairs specifying a closed path on the image. All coordinate pairs must be on the same line and the maximum number of vertices is 100.

3. Your expanded figure must be in another html format file (or it could be in the same one I guess).

4. Note that GIF images have their origin (0,0) on the top left corner, while IRAF images have 0,0 at the lower right. Therefore before generating your map, be sure you have made the proper transformations.

   If the number of objects is small (or conversely your patience is as large as the bounds of the Universe) you can go through "xv" on your image and click on the central coordinates of each of your zoom images. In this fashion you will be sure you have the coords. Any way this does serve as a double check on your transformation.

5. This is an example for which you might wish to see the source code:

   

   Do note however, that this is not a clickable map. For that you must have the ability to run cgi scripts.

   ---

   cnaw@ucolick.org
   Last modified: Wed Nov 11 19:18:40 1998