A Quick Start Lesson to the ASP.NET ImageMap Control

The ImageMap control in ASP.NET 2.0 and onward version can be used to create an image that contains defined hot spot regions. When a user clicks a hot spot region, the control can either generate a post back to the server or navigate to a specified URL.
For example, you can use this control to display a map of a geographical region. When a user clicks a specific region on the map, the control navigates to a URL that provides additional data about the selected region. Or, you can use an ImageMap control to capture user responses such as votes. When a user clicks the hot spot region defined for Yes votes, code is called to record a Yes response in a database.
Mixing these two scenarios within a single ImageMap control is also supported. For example, you can specify one hot spot region to navigate to a URL and another hot spot region to post back to the server.
There are three kinds of hot spot regions defined in ImageMap control. They are as follows.
·         RectangleHotSpot
·         CircleHotSpot
·         PolygonHotSpot
As the name implies, the RectangleHotSpot defines rectangular hot spot regions. The CircleHotSpot defines circle-shaped ones and the PolygonHotSpot is use for irregularly shaped hot spot area.
To define the region of the RectangleHotSpot object, use the Left, Top, Right and Bottom property to represent the coordinate of the region itself. For the CircleHotSpot object, set the X and the Y property to the coordinate of the centre of the circle. Then set the Radius property to the distance from the center to the edge. To define the region of a PolygonHotSpot, set the Coordinates property to a string that specifies the coordinates of each vertex of the PolygonHotSpot object. A polygon vertex is a point at which two polygon edges meet.
Let’s

Leave a Reply