How to: Add ImageMap Web Server Controls to a Web Page
An ImageMap control creates a graphic with hotspots that users can click individually. Creating an ImageMap control consists of creating the control, specifying the image, and then separately defining the hotspots.
To add an ImageMap control
From the Standard tab of the Toolbox, drag an ImageMap control onto the page.
In the Properties window, set the control's ImageUrl property to the URL of the graphic that you want to display.
Note
Click the button in the property box to display the Select Image dialog box.
Optionally, set the control's HotSpotMode property to specify whether clicking the hotspot results in navigation to another page or in a postback.
Note
You can override the control-wide setting for each hotspot.
To define hotspots
In the Properties window, click the HotSpots property box to display the HotSpot Collection Editor dialog box.
Click the arrow button next to the Add button to select the type of hotspot that you want to create (CircleHotSpot, RectangleHotSpot, PolygonHotSpot).
For each hotspot, use the properties grid to specify the coordinates for the hotspot, as listed in the following table.
Hotspot Type
Coordinates
You specify coordinates as x/y pairs. For example, a triangle would consists of three pairs of x/y coordinates, as in 0,0;100,100;200,0.
If you want to override the control's HotSpotMode setting, set the HotSpotMode property for each hotspot to specify whether clicking the hotspot results in navigation to another page or in a postback.
If a hotspot is set to navigate, specify its NavigateUrl property.
If a hotspot is set to perform a postback, set the PostBackValue for the hotspot to provide information about which hotspot is clicked. You can read the value in the Click event handler.
When you have finished defining hotspots, click OK.
See Also
Tasks
How to: Respond to User Clicks in ImageMap Web Server Controls