MapApps

JavaTM Imagemap Applet Freeware

by John Criswick, The Internet Conveyor Ltd. Updated: November 28, 1996

Summary

Java Imagemap Pros and Cons

Downloading and Using MapApps

MapApp Update List and Comments

Summary

Java based imagemaps can provide an alternative to server side and client side imagemaps. A Java imagemap can provide varying degrees of interactivity beyond what is currently possible with a client side image map, and especially with what can be achieved with a server side image map.

Nevertheless, many users still are not employing a Java capable browser! So you need to provide at least one other non-applet solution (e.g. a definition of a client side image map) if you choose to use one of these image map applets.

Compare the following two imagemaps: the first is implemented in Java, the second is the "sercer side" way of implementing an imagemap. To compare them, I have set up links so that the right and left arrows for each imagemap will take you to a different but same sized page. Only these two parts ofd the image map are active. Also, compare the status feedback that you see as you move your mouse over each image.

MapApps use the same format as the NCSA server-side image map definition file, so it is a simple matter to get these applets working if you already have a server side image map working!

In JavaTM:

[You will need a JavaTM capable browser to view this applet]

Using Server side Imagemaps:

JavaTM Imagemap Pros and Cons

Pros: (advantages)

User Feedback

This is probably the most important advantage of JavaTM based imagemaps. With JavaTM, users can appreciate more feedback while making their selections. Although not necessarily demonstrated here since I have only implemented a "bare bones" imagemap.

No default method required

What happens when a user clicks on an imagemap in a place that isn't "hot"? Since the imagemap is a hypertext anchor, users are always taken to another page. This obviously leads to an increase of time wastage and server traffic. JavaTM imagemaps give users more decisive power while surfing through web documents.

Usable on CDROM and in standalone applications

If you are considering using imagemaps in standalone web documents or on CDROMs, you can either use client side image maps or JavaTM based image maps. Still, a better "pro" worth considering is what level of feedback and user interface do you want to provide.

Improved security and reduced CPU overhead on server

If I compare to a server side imagemap, the task of navigating a document is handed over to the client. This means a server side imagemap script is no longer required and that equates to improved security and reduced server CPU overhead.

Cons: (disadvantages)

Increased download time and increased traffic on server

The same bandwidth concerns you apply to adding images to HTML documents should also be considered when adding JavaTM applets. MapApp1 is 7,719 bytes and in addition, it downloads the map layout file which is typically 250 bytes. This translates to about an extra 3.6 seconds in download time for a 14,400 baud modem user. You will have to weigh this aspect with the above advantages!

Usage of Java Enabled Browsers

I still believe (November '96) that there are not that many people out their who use or are allowed to use a Java enabled browser. I am aware of a number of government and commercial organizations who forbid their employees from downloading applets from outside of their intranet! So take into consideration that your users may not even be able or willing to see a Java applet...(someone has to contradict the hype!)

Downloading and Using MapApps

Intro

MapApp1

MapApp2

Image Map Layout File
Intro...

Two MapApps are currently available. MapApp1 provides the minimum functionality in the series. MapApp2 adds the ability for the user to see the "hot areas" by pressing on any key (while the mouse is over the imagemap).

To minimize the size of the applet I have excluded error messages and made a few restrictions on how the imagemap data is read in. In order to debug your imagemap layout, just use MapApp2 to let you see the hot region layout.

MapApps use the same map layout as for the imagemap script used by NCSA's httpd server (as explained here). So you hopefully will not need to redo this map file, but just to copy it to a new location.

MapApp1:

The main interface enhancements of MapApp1 over the server side image maps are:

- the URL is shown in the status bar as the user moves the mouse over the imagemap (live feedback!)
- no default URL is required in your map layout definition
- holding the mouse button down in the imagemap is like using a button in the sense that the user only sees either their current selection or nothing if they move out of the hot region. This is my way of telling the user they can back out of a selection.

MapApp1: (7,719 bytes) [You will need a JavaTM capable browser to view this applet]

Applet Tag Usage for MapApp1:

The applet tag for the above applet looks something like:

  <applet code="MapApp1.class" width=279 height=32>
  <param name=image value="samplemap.gif">
  <param name=map value="samplemap.mpp">
  </applet>
Notes:

- the width and height values should exactly match those of the image.
- the image specified is relative to the current HTML document (not an absolute URL)
- the map layout file is also relative to the current document
- just before </applet> you can put in regular HTML that will be seen by non-JavaTM browsers and not by JavaTM Browsers, e.g. this is where you place the original image map HTML statements.

To download the class file either download the raw class file or a compressed archive file. Once you have the class file on your site, make sure it is the same size as specified here:

The raw file:

MapApp1.class (7,719 bytes)

Compressed archives of the class file and this instruction file:

MapApp.tar.Z for UNIX (contains all applets)

MapApp.sit.hqx for Macintosh (contains all applets)

MapApp2:

MapApp2 is the same as MapApp1 but with additional code to help the user find the hot areas. To see the hot areas put the mouse over the imagemap and press any key.

MapApp2: (9,880 bytes) [You will need a JavaTM capable browser to view this applet]

Applet Tag Usage for MapApp2:

The usage is the same as MapApp1 except that you are allowed to specify the colour of the highlighted hot areas (you can use either spelling of colour or color). Valid colours are: black, gray, darkgray, lightgray, blue, cyan, magenta, green, yellow, orange, red, pink and white. 

  <param name=colour value=green>
To download the class file either download the raw class file or a compressed archive file. Once you have the class file on your site, make sure it is the same size as specified here:

The raw file:

MapApp2.class (9,880 bytes)

Compressed archives of the class file and this instruction file:

MapApp.tar.Z for UNIX (contains all applets)

MapApp.sit.hqx for Macintosh (contains all applets)

Image Map Layout File:

See this reference at NCSA for more information on setting up the map file. There are some additional restrictions and flexibilities however:

Restrictions:

-if you want to specify a default URL you must specify the URL, do not leave the line blank after the default statement.
-coordinates must not have space characters in them. The first example is acceptable, the second is not because it has a space before the 55: 
24,45    23, 55
Flexibilities:

-you do not need to specify a default method. This implies there will be parts of the imagemap that do not respond to the mouse button.
Note: any errors encountered in the layout of a method (rect, poly etc.) will result in it being ignored. Therefore I recommend using the feature in MapApp2 of holding the key down to verify your layout.

MapApp Update List and Comments

To receive notification of updates and additions to the MapApp library send mail to mapapps@conveyor.com with subscribe mapapps in the subject of the message. Send comments, URLs and requests for features or bug reports to John Criswick at criswick@conveyor.com.

As MapApps are Freeware, no warrantee is implied here in any sense. Therefore use them at your own risk, if any! But feel free to send me your URL so I can check out how you used it!

For more JavaTM applets go here.

Copyright 1995, 1996 The Internet Conveyor Ltd.