ImageMap热点响应的事件函数，编译时提示无法找到

我想实现下述效果：
在一幅图像中定义一个热点区域，然后单击这个热点区域，显示一个信息窗口
代码如下：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ProvinceMap.aspx.cs" Inherits="ProvinceMap" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>无标题页</title>
</head>
<body>
<a href="#" id="i" onclick="showPopup(300,200)">Open popup</a>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td style="width: 70px; height: 21px;">
                    <asp:Label ID="Label1" runat="server" Text="安徽省道路气象信息系统" Width="197px"></asp:Label></td>
                <td style="width: 100px; height: 21px;">
                </td>
            </tr>
            <tr>
                <td style="width: 70px; height: 26px;">
                    <asp:Button ID="bt_InqGraph" runat="server"  Text="图形查询" OnClientClick = "hidePopup();" />
                </td>
                <td style="width: 100px; height: 26px;">
                </td>
            </tr>
            <tr>
                <td style="width: 70px; height: 39px">
                    <asp:ImageMap ID="Test1" Height="711px" ImageUrl="安徽地图.bmp" Width="838px" 
                    HotSpotMode="PostBack" onclick="showUp(300,200)" runat="server" >
                    <asp:RectangleHotSpot
                     hotspotmode="Postback"
                     postbackvalue="Button3"
                     alternatetext="Button 3"          
                     top="10"
                     left="10"
                     bottom="25"
                     right="25">
                    </asp:RectangleHotSpot> 
                    </asp:ImageMap>
                    <div id="popupcontent" style="z-index: 101; left: 270px; width: 188px; position: absolute;
                        top: 40px; height: 141px;">
                        这是一个DIV弹窗效果</div>
                </td>
                <td style="width: 100px; height: 39px">
                </td>
            </tr>
        </table>
    
    </div>
    </form>
   <script>  var baseText = null; function showPopup(w,h)
{  
   var popUp = document.getElementById("popupcontent");    
   popUp.style.top = "300px";   
   popUp.style.left = "200px";  
   popUp.style.width = w + "px";  
   popUp.style.height = h + "px";    if (baseText == null) 
   baseText = popUp.innerHTML;  
   popUp.innerHTML = baseText + "<div id=\"statusbar\"><button onclick=\"hidePopup();\">Close window<button></div>";  
   var sbar = document.getElementById("statusbar");  
   sbar.style.marginTop = (parseInt(h)-40) + "px";   
   popUp.style.visibility = "visible";
} 
  
  
  function hidePopup()
  {
     var popUp = document.getElementById("popupcontent");
     popUp.style.visibility = "hidden";
  }
</script>
</body>
</html>
但是，编译时提示无法找到showPopup，请问这是什么原因呢？