内容
イメージマップを表示する為のプラグインです。クライアントサイドのMAPタグ、およびサーバーサイドのマップファイル指定に対応しています。
インストール方法
添付ファイルを解凍し、各ディレクトリに展開してください。また、プラグイン設定画面で imagemap を有効にしてください。
ダウンロード
以下のサイトからダウンロードしてインストールしてください。
依存関係
なし
利用方法
- imagemap
イメージマップを表示します。
{{imagemap [ページ名:]画像ファイル名,[ページ名:]マップ名,[ページ名:]マップファイル名}}
- マップ名は map プラグインで記述されたマップ名を指定します。 ページ名の指定がない場合は同一ページに記述されたmapプラグインのエリア情報を利用します。
- マップ・ファイル名は、ページに添付されたマップ情報が記述されたファイル名です。 ページ名の指定がない場合は同一ページに添付されたマップファイルを利用します。
- マップ名、マップ・ファイル名は、最低限どちらか一方を指定してください。 マップ名のみの場合は、map プラグインを使用してエリア情報を追加してください。
※マップ・ファイル内のマップ情報の記述方法は map プラグインのエリア情報を参照してください。
- map
マップタグを作成します。
{{map マップ名 〜 エリア情報 〜 }}
マップのエリア情報を作成するには、 = mapedit を利用すると便利です。
- エリア情報の書式
- エリア情報および、マップファイルの書式は以下の通りです。
エリア形状 "ページ名" 座標
==
= =エリア形状 書式 =rect rect "ページ名" x1,y1 x2,y2 =画像の2地点の座標(x1,y1 - x2,y2)の長方形内をクリックして表示するページを設定します。 =circle circle "ページ名" x,y r
circle "ページ名" x1,y1 x2,y2 =画像の(x,y)座標を中心とした半径 r の円座標内もしくは、画像の(x1,y1)座標を中心に(x2,y2)までの距離を半径とした円座標内をクリックして表示するページを設定します。 =poly poly "ページ名" x1,y1 x2,y2 x3,y3 ... =画像の座標(x1,y1 x2,y2 x3,y3 ...)を順番に結んだ多角形内をクリックして表示するページを設定します。 =default default "ページ名" =画像の任意の位置をクリックして表示するページを設定します。 =point point "ページ名" x,y 画像の点座標(x,y)をクリックして表示するページを設定します。(マップファイルのみ対応) 記述例:
// Earch circle Sandbox11 399,9 424,22 // MugCup rect Sandbox1 54,198 81,226 // Calender poly Sandbox2 68,2 71,66 140,72 139,1 // Gateway2000 P5-120 rect Sandbox3 38,227 89,324 // その他 default FrontPage
- クライアントサイドのイメージマップを使用する場合は以下のことに注意してください。
- 直前のコメント部は area タグの title 属性に付加されます。
- default属性は最後に記述するのがコツです。(最初に記述すると Mozilla系では画像内のリンクが全てdefaultになる)
- default属性はIEでは扱えないようです。
サンプル
それぞれのリンク領域以外をクリックすると FrontPage へ飛ぶようになっています。
ページ内にマップ情報埋め込み
記述方法:
{{imagemap sample.png,sample}} {{map sample // Linux rect Linux 8,8 110,128 // Windows rect Windows 192,43 306,144 // FSWiki rect FSWiki 109,178 223,268 // その他 default FrontPage }} |
マップ情報ファイルをページへ添付
記述方法:
{{imagemap sample.png,,sample.map}} |
sample.map ファイルの内容:
// Linux rect Linux 8,8 110,128 // Windows rect Windows 192,43 306,144 // FSWiki rect FSWiki 109,178 223,268 // その他 default FrontPage |
変更履歴
- 2006/02/20
- 新規作成
- 2014/08/05
- パート指定対応
Comment(2)
最終更新時間:2014/08/07-13:41:44