Hi Gurbhej,
I think this will help you :
Declaring the image map and image:
var oSel1 = new sap.ui.commons.Image("oSel1");
oSel1.setSrc("images/usa.png");
oSel1.setUseMap("Map1");
var oMap = new sap.ui.commons.ImageMap("Map1");
oMap.setName("Map1");
creating the areas on image map :
var aArea1 = new sap.ui.commons.Area ("WA", {shape: "poly", tooltip: "Washington", href: "#", coords: "23,6,24,27,58,35,62,10,35,3"});
var aArea2 = new sap.ui.commons.Area ("OR", {shape: "poly", tooltip: "Oregon", href: "#", coords: "22,23,11,49,10,60,51,71,56,48,60,37"});
adding areas on the map :
oMap.addArea(aArea1);
oMap.addArea(aArea2);
now getting the map areas id in controller :
oMap.attachPress(function(oControlEvent){
var rcode = oControlEvent.getParameters().areaId;
alert(rcode);
});
Result: when you press the particular area it will alert that area id (like in this case "WA" or "OR") , through this you can differentiate different areas on the image.
thanks
Viplove