<img id="ff" src="中国地图.jpg" width="400" height="277" border="0" usemap="#parliament" />
<map name="parliament" id="parliament">
  <area shape="poly" coords="173,66,152,85,126,118,108,155,97,168,81,166,68,167,50,164,42,170,26,169,6,171,2,174,3,178,18,178,13,186,7,185,4,193,8,196,14,200,18,206,22,216,19,218,45,210,70,211,71,216,72,230,66,237,82,224,92,225,115,230,130,233,144,237,154,238,174,242,186,246,198,254,225,263,240,268,260,269,301,266,297,251,243,236,228,226,206,224,194,215,180,206,162,196,141,185,121,175" href="javascript:alert('北京欢迎您')" />
</map>
其中坐标是要根据定义的形状自己设置的。矩形比较简单，多边形就需要坐标参数多一些

------解决方案--------------------
建议你先了解一下什么是热点图：http://book.51cto.com/art/201002/182033.htm