次の方法で共有

ImageMap Web サーバー コントロールの宣言構文

  • [アーティクル]

更新 : 2007 年 11 月

ページ上にイメージを表示するコントロールを作成します。ImageMap コントロールは、コントロール内に定義されたホット スポット領域がクリックされると、サーバーへのポストバックを生成するか、指定された URL へ移動します。

<asp:ImageMap
    AccessKey="string"
    AlternateText="string"
    BackColor="color name|#dddddd"
    BorderColor="color name|#dddddd"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    CssClass="string"
    DescriptionUrl="uri"
    Enabled="True|False"
    EnableTheming="True|False"
    EnableViewState="True|False"
    ForeColor="color name|#dddddd"
    GenerateEmptyAlternateText="True|False"
    Height="size"
    HotSpotMode="NotSet|Navigate|PostBack|Inactive"
    ID="string"
    ImageAlign="NotSet|Left|Right|Baseline|Top|Middle|Bottom|
        AbsBottom|AbsMiddle|TextTop"
    ImageUrl="uri"
    OnClick="Click event handler"
    OnDataBinding="DataBinding event handler"
    OnDisposed="Disposed event handler"
    OnInit="Init event handler"
    OnLoad="Load event handler"
    OnPreRender="PreRender event handler"
    OnUnload="Unload event handler"
    runat="server"
    SkinID="string"
    Style="string"
    TabIndex="integer"
    Target="string"
    ToolTip="string"
    Visible="True|False"
    Width="size"
>
            <asp:CircleHotSpot
                AccessKey="string"
                AlternateText="string"
                HotSpotMode="NotSet|Navigate|PostBack|Inactive"
                href="uri"
                PostBackValue="string"
                Radius="integer"
                TabIndex="integer"
                Target="string|_blank|_parent|_search|_self|_top"
                X="integer"
                Y="integer"
            />
            <asp:PolygonHotSpot
                AccessKey="string"
                AlternateText="string"
                Coordinates="string"
                HotSpotMode="NotSet|Navigate|PostBack|Inactive"
                href="uri"
                PostBackValue="string"
                TabIndex="integer"
                Target="string|_blank|_parent|_search|_self|_top"
            />
            <asp:RectangleHotSpot
                AccessKey="string"
                AlternateText="string"
                Bottom="integer"
                HotSpotMode="NotSet|Navigate|PostBack|Inactive"
                Left="integer"
                href="uri"
                PostBackValue="string"
                Right="integer"
                TabIndex="integer"
                Target="string|_blank|_parent|_search|_self|_top"
                Top="integer"
            />
</asp:ImageMap>

解説

ImageMap コントロールは、定義済みのホット スポット領域を含むイメージを作成するために使用します。このコントロールは、ユーザーがホット スポット領域をクリックすると、サーバーへのポストバックを生成するか、指定された URL へ移動します。

ImageMap コントロールの使用法の詳細については、「ImageMap Web サーバー コントロールの概要」を参照してください。

ホット スポット機能は必要なく、ユーザーがクリックした場所の座標を取り込むだけでよい場合は、代わりに Image コントロールを使用できます。

使用例

2 つの CircleHotSpot オブジェクトを含む ImageMap コントロールを宣言的に作成する方法を次のコード例に示します。HotSpot.HotSpotMode プロパティは HotSpotMode.Navigate に設定されており、円形のホット スポット領域のうち 1 つをユーザーがクリックするたびに、指定された URL へページが移動します。この例を正常に機能させるには、ImageUrl プロパティに独自のイメージを設定し、アプリケーションがそのイメージの場所を特定できるよう、イメージへのパスを適切に更新する必要があります。

<%@ Page Language="VB" %>

<!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 id="head1" runat="server">
  <title>ImageMap Class Navigate Example</title>
</head>
  <body>
    <form id="form1" runat="server">

      <h3>ImageMap Class Navigate Example</h3>

      <h4>Shopping Choices:</h4>

       <asp:imagemap id="Shop"           
        imageurl="Images/ShopChoice.jpg"
        alternatetext="Shopping choices" 
        runat="Server">    

        <asp:circlehotspot
          navigateurl="http://www.tailspintoys.com"
          x="145"
          y="120"
          radius="75"
          hotspotmode="Navigate"
          alternatetext="Shop for toys">           
        </asp:circlehotspot> 

        <asp:circlehotspot
          navigateurl="http://www.cohowinery.com"
          x="145"
          y="290"
          radius="75"
          hotspotmode="Navigate"
          alternatetext="Shop for wine">
        </asp:circlehotspot>     

      </asp:imagemap>                 

    </form>      
  </body>
</html>

<%@ page language="C#" %>

<!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 id="head1" runat="server">
  <title>ImageMap Class Navigate Example</title>
</head>
  <body>
    <form id="form1" runat="server">

      <h3>ImageMap Class Navigate Example</h3>

      <h4>Shopping Choices:</h4>

      <asp:imagemap id="Shop"           
        imageurl="Images/ShopChoice.jpg"
        width="150" 
        height="360"
        alternatetext="Shopping choices" 
        runat="Server">    

        <asp:circlehotspot
          navigateurl="http://www.tailspintoys.com"
          x="75"
          y="290"
          radius="75"
          hotspotmode="Navigate"
          alternatetext="Shop for toys">           
        </asp:circlehotspot> 

        <asp:circlehotspot
          navigateurl="http://www.cohowinery.com"
          x="75"
          y="120"
          radius="75"
          hotspotmode="Navigate"
          alternatetext="Shop for wine">
        </asp:circlehotspot>     

      </asp:imagemap>                 

    </form>      
  </body>
</html>

参照

概念

ImageMap Web サーバー コントロールの概要

参照

ImageMap