JavaScript Editor jscript editor     Web designer 

Main Page

The ASP.NET ImageMap control allows you to create an image that has individual regions that users can click, which are called hot spots. Each of these hot spots can be a separate hyperlink or postback event.

ImageMap Elements

The ImageMap control consists primarily of two pieces. The first is an image, which can be a graphic in any standard Web graphic format, such as a .gif, .jpg, or .png file.

The second element is a collection of hot-spot controls. Each hot-spot control is a different element. For each hot-spot control, you define its shape—a circle, rectangle, or polygon—and the coordinates that specify the location and size of the hot spot. For example, if you create a circle hot spot, you define the x and y coordinates of the circle's center and the circle's radius.

You can define as many or as few hot spots for the image as you require. You do not need to define hot spots to cover the graphic entirely.


You can define overlapping hot spots. Each hot spot has a z-index value, and if a user clicks an area that is defined by two or more overlapping hot spots, the hot spot with the highest z-order is the hot spot that is selected.

Responding to User Clicks

You can specify what happens when a user clicks a hot spot on an ImageMap control. Each hot spots can be configured as a hyperlink that goes to a URL that you provide for that hot spot. Alternatively, you can configure the control to perform a postback when a user clicks a hot spot, providing a unique value for each hot spot. The postback raises the ImageMap control's Click event. In the event handler, you can read the unique value that you assign to each hot spot.

See Also

JavaScript Editor jscript editor     Web designer