Mapedit 2.63

A WYSIWYG editor for WWW imagemaps

Leggi attentamente questa pagina e scarica il software

Boutell.Com, Inc.


See the "About" option of the Help menu for more information regarding the license governing this version of the product.

Table of Contents

Credits and License Terms

Mapedit, copyright 1994, 1995, 1996, 1997, 1998, 1999, 2000 by Boutell.Com, Inc. Mapedit is not free software. See the "about" option of the Help menu for details of the license governing this copy of the product.

Mapedit takes advantage of the gd graphics library, by Thomas Boutell, copyright 1994, 1995, 1996, 1997, 1998, 1999, 2000 by Cold Spring Harbor Laboratory. The portions of gd used in this product benefit from GIF decompression code made available by David Koblas. JPEG support is based in part on the work of the Independent JPEG Group. PNG support is based on LIBPNG, made available by Guy Eric Schalnat of Group 42, Inc. in association with Dave Martindale, Paul Schmidt and Tim Wegner.

What's New in Version 2.63

Version 2.63 features improved install and uninstall support.

What's New in Version 2.62

What's New in Verrsion 2.44

What's New in Version 2.43

Version 2.43 will open HTML documents with filenames that do not end in .HTM and .HTML.

What's New in Versions 2.4 through 2.42

Version 2.42 corrects a problem which removed all HTML comments from certain documents in versions 2.4 and 2.41. Also, underscores are no longer escaped in URLs; this was not a bug, but it was causing confusion. Version 2.42 displays all .HTM, .HTML, and .ASP files when browsing for an HTML document to open rather than requiring the user to select one extension at a time. A similar change was made to the image file browser.

Versions 2.4 has a new user interface which emphasizes client side imagemaps. All imagemap editing is now done in the context of an HTML document. Server side imagemaps can still be edited by importing and exporting them to and from HTML documents.

Version 2.41 respects WIDTH and HEIGHT attributes to the <IMG> HTML tag. This means that Mapedit displays images at the same size they appear in your web page, so hotspots work properly with scaled images. Please do not use percentages when scaling images, however, because every user's browser is a slightly different size. It is impossible for Mapedit to compensate for this. Use a specific size in pixels to get the effect you want.

Mapedit 2.41 automatically removes the blue border around imagemaps. You can explicitly turn it back on by adding a border=1 attribute to your <IMG> tag. You can also turn off this feature in Mapedit from the File menu, in which case Mapedit will not remove blue borders at all.

What's New in Version 2.3

Version 2.3 accepts animated GIFs and displays the first frame. (The GIF does not animate, however.) Earlier versions did not always open animated GIFs gracefully.

Version 2.3 respects the NCSA or CERN setting when creating a new server side imagemap from scratch. However, most users will never create server side imagemaps.

Version 2.3 supports onMouseOver and onMouseOut attributes for each hotspot, when editing client side imagemaps. These are useful to JavaScript programmers, but most users will not need them.

User interface improvements were also made.

Releases in the 2.x series repaired bugs, greatly improved the user interface, made registration more convenient, and added a ten-day grace period after registration expires. Version 2.0 also added support for directly opening your existing HTML pages to add client side imagemaps. Compatibility with Javascript and overall reliability were improved by releases in the 2.2 series.

What is Mapedit?

Mapedit is a WYSIWYG (What You See Is What You Get) editor for imagemaps.

Imagemaps allow you to turn a GIF, JPEG or PNG image into a clickable map by designating polygons, circles and rectangles within the image and specifying a URL for each to link to. Client-side imagemaps, which are now available in virtually all web browsers, can do all of the above without the help of a special program on the server.

Unfortunately, creating good image maps by hand is a lot of work, because the points must be located using an editor not explicitly designed for the purpose.

Mapedit allows you to load your image into a scrollable, resizable window and then draw polygons, circles and rectangles on top of it, specifying a URL for each. It also allows you to go back and delete these "hotspots," set a default URL for clicks outside of the "hot" areas, and so on. In addition, it allows you to associate alternative text, frame targets, and even Javascript attributes with each object.

How do I install imagemaps?

Before investing a great deal of time and effort in using Mapedit for Windows, please read the following.

How do I install client-side imagemaps?

If you use client-side imagemaps, all you need is an HTML document containing inline images! Client-side imagemaps work do not require a web server. Just make sure both the document and the images are present on your drive, and use the Open HTML Document option on the file menu to open the HTML document. Mapedit will insert the proper tags into your HTML document when you save your work.

Very, very old web browsers do not support client side imagemaps. You may wish to export server side imagemaps for use with these browsers. You can do this from the file menu after creating a client side imagemap.

Which browsers support client side imagemaps?

Virtually all modern browsers. Specifically:

Netscape 2.0 or better

Microsoft Internet Explorer (all versions)

Spyglass Mosaic 2.1 and derivatives thereof

Most other browsers

How do I install server-side imagemaps?

Unlike client-side imagemaps, server-side imagemaps are supported by even the very oldest web browsers. You can create them using the Export feature of Mapedit. This time, the difficulty is that you must have access to an actual World Wide Web server on which cgi scripts, specifically the imagemap program (not this program!), have been installed. Or, your web server may have this capability built in. Consult the administrator of your web server and/or documentation of your web server.

The server does NOT have to reside on your MS Windows system, although that is possible. You can run Mapedit to your heart's content without a server, as long as you upload the resulting imagemaps to the server and install them correctly. Be aware that A SERVER-SIDE MAP WILL NOT DO ANYTHING UNTIL YOU PUT IT ON A SERVER.

If you are unfamiliar with web servers, server-side imagemaps and so forth, we suggest you consult the World Wide Web FAQ, available at the following URL:

How do I get started editing an imagemap?

Once you have read the introductory hints, Mapedit will display a file selection dialog box. Use this dialog box to select an existing HTML document containing the image you want to add hotspots to. If you do not have any HTML documents yet, you should create one before using this program.

Next, you will be prompted to indicate which of the images included in that HTML document is of interest. The image, which can be in GIF, JPEG, or PNG format, must already exist. Mapedit is not a paint program. To create your own images, use any paint program, such as Paint Shop Pro (NOTE: we are not affiliated with this product in any way). Conversion utilities are widely available to convert .bmp files into other formats.

Click on OK when you have selected the image of your choice.

Mapedit will now load your image into memory. This will take a few moments, depending on the size of the image. If Mapedit cannot guess the location of the image on disk, it will prompt you to locate it using a file selection dialog box.

When the image has been loaded, it will appear in the main mapedit window, which should expand or shrink to suit the image. If the image is large, scrollbars for horizontal and vertical movement will appear.

You can navigate the image using the scrollbars; you can also resize the window as needed.

How do I make "hotspots?"

Image maps consist of areas that have been designated as "hotspots" which users can click on to fetch particular URLs. Mapedit allows you to draw these graphically on the screen.

Check out the following related topics for more information:

How do I specify rectangles?

If the Rectangle tool is not already checked in the Tools menu, then select Rectangle from the Tools menu. Next, click the left mouse button in one corner of a rectangular region of interest in the image. Now move the mouse pointer to the opposite corner, tracing out a rectangle. (You do not need to hold down the mouse button.) To complete the rectangle, click the mouse button again.

You will then be prompted for a URL, and for other information about the hotspot.

How do I specify polygons?

Select Polygon from the Tools menu to begin drawing a polygonal hotspot. Now click the left mouse button at some point on the edge of an area of interest in the image.

Move the mouse pointer to another point on the edge of the area of interest, tracing its outline. Note that a "rubber-band" line follows you from the point of the initial click.

Click again at this second point. Continue clicking points until you have outlined all but the final connection back to the first point. (You do not need to hold down the mouse button.)

Note that if you don't like the way your polygon is turning out, you can press the ESC key to cancel it. Then, start over with the left mouse button.

To complete the polygon, click the right mouse button, or press the ENTER key if you have assigned a different purpose to the right mouse button.

You will then be prompted for a URL, and for other information about the hotspot.

How do I specify circles?

Select Circle from the Tools menu. Circles work just like rectangles, except that the left mouse click positions the center of the circle, and you can then move the mouse pointer to any point on the edge of the desired circle and click the mouse button again to accept it.

You will then be prompted for a URL, and for other information about the hotspot.

Entering URLs

When you complete a hotspot, the URL window will pop up, prompting you for the URL that this hotspot should link to. The URL you enter should be a legal URL. For example:

Relative URLs such as filename.html are even better because they still work if you move your documents to another site. Do not enter HTML tags in the URL field. Only the URL is needed.

ALT (Alternative) Text

Be sure to enter a text alternative (the ALT field) for each hotspot. When your page is viewed by a web browser that does not support graphics, the user may also be presented with a menu of the text alternatives, instead of an image. (Up-to-date versions of the popular Lynx browser support this feature.)
Netscape 4 will display the ALT text as pop-up text. However, this feature of Netscape does not work reliably. We DO NOT RECOMMEND relying heavily on this feature to display ALT text as pop-up text. It often fails to work if the user has to scroll the window and there may be other flaws as well. This is a problem with Netscape and it has nothing to do with Mapedit. ALT text is intended for non-graphics browsers!

TITLE (Pop-Up) Text

Some newer web browsers, such as Microsoft Internet Explorer 4.0 and up (but NOT including Netscape as of version 4.5), will display the TITLE text as "pop-up" text when the mouse moves over the hotspot. Mapedit 2.5 and later will automatically set the TITLE text to match the ALT text unless you choose to turn this feature off using the "Same As ALT" checkbox. If you choose to turn off that checkbox, you must enter the TITLE text separately.

How do I target a hotspot to a specific frame?

Mapedit 2.24 and up provide a separate field in the URL dialog box in which to enter the target frame. If the new document should erase all currently displayed frames and occupy the entire browser window, enter _top in the target field. Other special target values documented by Netscape will also work. If this field is left blank, the new document occupies the frame that contained the imagemap.

How do I add JavaScript features to my hotspots?

When working with client side imagemaps, version 2.3 or higher of Mapedit will display entry fields for the onMouseOver and onMouseOut attributes. If you enter JavaScript code in these fields, it will be executed by Netscape 3.0 or later when the mouse moves over and then out of the area, even though the user has not clicked yet.

If you do not know Javascript programming, these fields are probably not for you. If you just want popup text for your hotspots, you should think about using the TITLE field instead.

Do not use double quotes (") in these fields. They will cause Mapedit (and Netscape!) to think you have already ended the attribute. Use single quotes, or better yet, call a function that appears elsewhere in your web page, usually between <script> and </script> tags in the <head> section.

To perform a JavaScript action only when the user clicks on a hotspot, use a javascript: URL, by typing javascript: followed by appropriate javascript code in the URL field.

For more information about JavaScript, please see Netscape's web site for developers. We do not provide tech support on JavaScript itself.

Finishing your Hotspot

When you have completed your entry, click on OK or press RETURN to continue.

The hotspot will now be drawn completely. For polygons, a final side between the last point and the first point will be added automatically. If the outline is not easily visible on this image, try selecting Edit Hotspot Color from the File menu. The outline you see is displayed for your benefit while working in Mapedit. It is not a permanent modification of your image.

Editing the hotspot color

You can edit the hotspot color by selecting Edit Hotspot Color from the File menu. You will be presented with the standard color selection dialog box, in which you can click on a color of your choice. Look for a color that contrasts well with the colors present in your images. The outline color you see is displayed for your benefit while working in Mapedit. It is not a permanent modification of your image!

Mapedit will remember your choice of color indefinitely.

How do I test my hotspots?

Select Test/Edit from the Tools menu. Now click at various points in the image. When you click in a hotspot, such as a polygon, rectangle or circle you have designated, the URL window will pop up, showing the URL assocated with that hotspot. Also, the region within the hotspot will be displayed in reverse video.

Important note: when hotspots overlap, the oldest gets the click. This is important because this is how the actual imagemap program will behave when your users click on your map in practice.

How do I go back and edit URLs?

Often you will not know the final URL for each hotspot at first, or you will want to change it. You can do so by selecting Test/Edit from the Tools menu and clicking in the hotspot in question, editing the URL that appears, and then clicking on OK or pressing RETURN. You can also edit the other fields at this time. Note that you can cut, copy and paste using the control-x, control-c and control-v keys (just as in all other Windows applications).

How do I delete unwanted hotspots?

Select Test/Edit... from the Tools menu. Note that a Delete button appears in the URL dialog box when you select a hotspot. By clicking this button, you can remove that hotspot from the map.

Information about removing individual polygon vertexes

How do I move hotspots and individual points?

To move an existing hotspot or one of its corners, first select the Move tool from the tools menu. Next, click on the hotspot you wish to move.

Note that the corners of the hotspot are now highlighted. The center of the hotspot is also highlighted. You can click, hold and drag any of these points with the mouse. Dragging the center moves the entire hotspot.

How do I add points to polygons?

To add points to an existing polygon, first select the Add Points tool from the tools menu. Next, click on the polygon of interest. The polygon will be highlighted.

Next, click anywhere in the image to add an additional point to the polygon. The polygon will grow to accommodate the extra sides.

If you wish to add additional points, select the polygon again each time.

How do I remove points from polygons?

To remove points to an existing polygon, first select the Remove Points tool from the tools menu. Next, click on the polygon of interest. The vertexes (corners) of the polygon will be highlighted.

Next, click on the vertex you wish to remove from the polygon.

If you wish to remove additional points, select the polygon again each time.

Information about removing entire hotspots

How do I set a default URL?

The default URL, if present, is used when a mouse click does not fall in any of the regions you have drawn. (If you don't want anything to happen in that case, do not set a default URL.)

To set a default URL, pull down the file menu, select Edit Default URL..., and enter a default URL in the window that appears. Click on OK or press RETURN to accept it.

You can test the default URL by clicking outside of any defined hotspot when using the Test/Edit tool.

You may wish to get rid of the default URL completely. Once you have set a default URL, a Delete button will appear in the Edit Default URL dialog box. Click this button to remove the default URL.

What happened to the blue border around my image?

Mapedit 2.41 automatically removes the blue border around imagemaps. Most users prefer it this way. You can explicitly turn it back on, if you wish, by adding a border=1 attribute to your <IMG> tag. You can also turn off this feature in Mapedit from the File menu, in which case Mapedit will not remove blue borders.

Example: <IMG SRC="foo.gif" USEMAP="#foo" BORDER="1">

IMPORTANT NOTE: many users depend on this visual cue to identify images that link to other documents, but most designers don't like it. Since Mapedit removes the visual cue, be sure to make clear that the image should be clicked upon in some other way.

How do I save my work?

Pull down the file menu and select Save. Mapedit will write your imagemap out as part of the HTML document you opened when you began your work.

If a problem is encountered while writing this file, use the Save As file menu option to enter a new name for the HTML document.

Can I edit my existing imagemap files?

Yes. mapedit can read existing imagemap files without difficulty. If you previously worked with server-side ".map" files, you will need to open an HTML document first. Then, use the Import option on the file menu to bring an old-style imagemap into your HTML document.

Can I convert between imagemap formats?

Yes. You can create a server-side imagemap by using the Export file menu option. You will be prompted for the type of server-side imagemap and for the filename you wish to save under.

To create a client-side imagemap from an existing server-side imagemap, see more information about importing server-side imagemaps.

If you convert a client-side imagemap to server-side, alternative text fields will become comments. If you convert any other format to the CERN format, comments will be discarded. All other additional fields, such as frame targets, alternate text, title text and javascript fields, are not supported in server-side imagemaps.

Why does Internet Explorer display an outline around the hotspot I just clicked on?

Microsoft chose to implement this feature in order to provide the user with a clear indication that a link is being followed. We do not know of any way to override this feature, which is a part of Microsoft Internet Explorer. We do not control the decisions of Microsoft! If you do not like this feature, contact Microsoft and ask for a way to turn it off.

Year 2000 (Y2K) Compliance Statement

All versions of Mapedit are fully Year 2000 compliant.

Certain aspects of Mapedit rely on your computer's operating system. We are not responsible for faults in the underlying operating system. If your operating system reports false information to Mapedit after the year 2000, that is beyond our control or responsibility.

Please feel free to contact Boutell.Com with any further questions.

For more information

If you have any difficulties with mapedit, feel free to contact Boutell.Com technical support. Send email to Please read this manual thoroughly first. Also see the following URL for more information about the latest and greatest version of Mapedit:

Copyright 1994, 1995, 1996, 1997, 1998, 1999, All Rights Reserved, by Boutell.Com, Inc.