Click here to Skip to main content
14,304,866 members

ImageMap.NET 2.0

Rate this:
3.58 (6 votes)
Please Sign up or sign in to vote.
3.58 (6 votes)
31 Aug 2006
An alternative ImageMap control for ASP.NET 2.0


The .NET framework comes with a nice set of web server controls that allows you to code for ASP.NET in a object-oriented manner and hiding the complexity of HTML, scripting and browser versioning. Unfortunately .NET 1.x didn't have a control that could generate image maps. I needed one so I decided to make one myself and make it public here.

My control had a few limitations so I was happy to find out that ASP.NET 2.0 had a ImageMap control. After playing with it, I found that it also has its own limitations. I decided then to create a new version of my ImageMap control for ASP.NET 2.0.

Why another control?

This control can do all that Microsoft's control does plus the following:

  • Assign javascript to the hot spots. For example, you can change the background image when the mouse cursor hovers an hot spot.
  • The hot spots are displayed in design mode. Colored by hot spot mode.
  • The polygon hot spots are defined by a list of vertices instead of a string of coordinates.
  • Image maps can share the same hot spot layout. HTML supports it, why not support it too?
  • Display a description string on the browser's status bar when the mouse cursor hovers on a hot spot.
  • The click event handler's argument supplies a reference to the hot spot and the coordinates where it was clicked.

Assigning Javascript to hot spots

To assign Javascript to an hot spot, you just need to use the Attributes parameter the following way:

YDreams.Web.UI.WebControls.PolygonHotSpot polygonHotSpot = (YDreams.Web.UI.WebControls.PolygonHotSpot)this.ImageMap1.HotSpots["Polygon"];
if (polygonHotSpot != null)
    polygonHotSpot.Attributes.Add("onMouseOver", "javascript:alert("hi");");

In the demo project you can see how to change the image when the mouse cursor hovers on a hot spot.

Post back handler

The click event handler is slightly different. The last argument gives you a reference of the hot spot the user clicked on and the mouse cursor coordinates relative to the upper-left corner of the control.

protected void ImageMap1_Click(object sender, YDreams.Web.UI.WebControls.ImageMapClickEventArgs args)
    YDreams.Web.UI.WebControls.HotSpot hotSpot = args.HotSpot;
    int x = args.X;
    int y = args.Y;

Tested browsers

The control has been tested on the following browsers:

  • Microsoft Internet Explorer 6.0
  • Mozilla Firefox 1.5


  • 8/31/2006 - Fixed bug that prevented post backs from happening when other controls with AutoPostBack set to true where present.
  • 3/2/2006 - Submitted article.
  • 3/8/2006 - Added actions to toggle hot spots display in design mode.


This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


About the Author

Software Developer (Senior) LusoVU
Portugal Portugal
No Biography provided

Comments and Discussions

General4 polygon rollover images Pin
dmgroup198419-May-09 11:58
memberdmgroup198419-May-09 11:58 
GeneralRe: 4 polygon rollover images Pin
dmgroup198428-Jul-09 11:26
memberdmgroup198428-Jul-09 11:26 
GeneralRe: 4 polygon rollover images Pin
dmgroup198428-Jul-09 13:56
memberdmgroup198428-Jul-09 13:56 
GeneralPostBackValue Pin
TechyPol15-Nov-07 1:34
memberTechyPol15-Nov-07 1:34 
GeneralThis control is useless because of the Bugs Pin
durden814-Oct-07 3:28
memberdurden814-Oct-07 3:28 
AnswerRe: This control is useless because of the Bugs Pin
aalmada4-Oct-07 3:42
memberaalmada4-Oct-07 3:42 
GeneralRe: This control is useless because of the Bugs Pin
durden814-Oct-07 4:19
memberdurden814-Oct-07 4:19 
GeneralGeca Pin
Geca5-Jul-07 0:57
memberGeca5-Jul-07 0:57 
QuestionDynamic image maps? Pin
BryanMohr12-Mar-07 1:02
memberBryanMohr12-Mar-07 1:02 
Generalonclick fires repeatedly Pin
Mihai Drebot23-Jan-07 1:02
memberMihai Drebot23-Jan-07 1:02 
GeneralRe: onclick fires repeatedly Pin
karlitr0s31-May-07 6:55
memberkarlitr0s31-May-07 6:55 
GeneralRe: onclick fires repeatedly Pin
karlitr0s31-May-07 23:06
memberkarlitr0s31-May-07 23:06 
GeneralAjax.Net Pin
afriend2123426-Oct-06 8:29
memberafriend2123426-Oct-06 8:29 
GeneralOnClick Event Fires too Early Pin
ft6221-Sep-06 4:38
memberft6221-Sep-06 4:38 
QuestionRe: OnClick Event Fires too Early Pin
WinterBlade16-Oct-07 8:50
memberWinterBlade16-Oct-07 8:50 
AnswerRe: OnClick Event Fires too Early Pin
Frans6221-Oct-07 21:21
memberFrans6221-Oct-07 21:21 
GeneralRe: OnClick Event Fires too Early Pin
WinterBlade26-Oct-07 10:03
memberWinterBlade26-Oct-07 10:03 
QuestionCan the area be colored? Pin
t395010-Sep-06 9:26
membert395010-Sep-06 9:26 
QuestionDLL not found Pin
smart_chetan22-Aug-06 19:44
membersmart_chetan22-Aug-06 19:44 
AnswerRe: DLL not found Pin
aalmada31-Aug-06 1:18
memberaalmada31-Aug-06 1:18 
GeneralPostback bug Pin
Bunce28-Jun-06 14:40
memberBunce28-Jun-06 14:40 
QuestionWhere is the DLL ? Pin
vedcyrus22-Jun-06 19:53
membervedcyrus22-Jun-06 19:53 
QuestionClick Event won't fire Pin
Bunce19-Jun-06 18:27
memberBunce19-Jun-06 18:27 
QuestionNo Postback Pin
wallyvis20-Apr-06 22:41
memberwallyvis20-Apr-06 22:41 
QuestionRe: No Postback Pin
Bunce18-Jun-06 1:10
memberBunce18-Jun-06 1:10 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Posted 2 Mar 2006


39 bookmarked