Image Maps

PAGE (4 of 4)

MapThis! Image Map App

MapThis! MapThis appears to have been withdrawn as available image map software on the Web, (11/13/98). There are other image map applications available. One that appears good is CuteMap. When time is available these pages will be updated to creating a map with MAPEDIT, the process is very similiar to the techniques described below.

Creating an Image Map

Step 1:

In order to create a sample client-side image map, use the browser back button to return to the previous example page and right click on the world image. Select "Save image as..." from the pop-up menu to save the image to your hard drive.

Step 2:

Locate and launch the MapThis! image map application from the , Program menu.

From the File menu select New and in the dialog box depress the "Let's go find one!" button. Locate the saved world gif file in the file open dialog box.

Step 3:

Select the geometric shape, (rectange, circle or polygon) MapThis! button and draw the shape over a continent. (If the Area List window is not visible, select it from the View menu.) Double-click on the Area List entry for the previous drawn shape. In the Region#? Settings window enter the URL to be linked to the shape and a comment about the region. Continue this process for each of the continents using appropriate shapes for each continent to best cover their area.

Step 4:

After mapping all of the continents, select Save as... from the File menu. In the Mapfile dialog box, enter a map title, and default URL for uncovered regions and select the NCSA Map file format. Enter a filename.imp for for the map file.

Step 5:

Create a simple HTML file and place a link to the image map world.gif in the file. Open the saved imagemap.imp file created with MapThis!. MapThis! saves the image map files in a server-side format.

Step 6:

Use the browser back button to return to the previous example page. Select and copy the client-side world map file specification and paste it into the HTML file to use as a template.

Step 7:

From the imagemap.imp file cut and paste the shape type, URL and associated pixel coordinates into the Area Shape, COORDS and HREF attributes of the client-side MAP tag. Open the HTML file in a Web browser and try out the image map, correcting any incorrect links.