置顶公告:【置顶】关于临时开启评论区所有功能的公告(2022.10.22) | 【置顶】关于本站Widget恢复使用的公告
  • 你好~!欢迎来到萌娘百科镜像站!如需查看或编辑,请联系本站管理员注册账号。
  • 本镜像站和其他萌娘百科的镜像站无关,请注意分别。

使用說明:Imagemap

萌娘百科,萬物皆可萌的百科全書!轉載請標註來源頁面的網頁連結,並聲明引自萌娘百科。內容不可商用。
跳至導覽 跳至搜尋
Commons-emblem-notice.svg
這個頁面「Help:Imagemap」是萌娘百科的幫助文檔
  • 本文用於介紹萌娘百科中一些特定功能的操作方法;
  • 本文僅是一篇論述,不屬於方針或指引。如果本指南與相關方針或指引發生衝突或存在不一致的情況,請以方針或指引的條文為準。

在HTML或XHTML中,ImageMap是一個HTML標籤,能夠在給出圖像中的坐標列表時,該坐標將圖像的區域超連結到多個目標。萌娘百科啟用了這一HTML標籤,你可以將該標籤用於地圖和人物關係圖中。

使用方法

<imagemap>標記的內容由空行、注釋(以#開頭)和邏輯行組成。第一個邏輯行指定要顯示的圖像,填寫方式如Help:圖像所述一樣,但圖像的引用方式必須為內鏈。如果第一行指定「thumb」或「frame」圖像,則第一行的標題和任何| alt=參數將按通常的方式處理為圖像的標題和alt文本;否則,第一行的| alt=參數(如果沒有,則為任何標題)指定圖像的alt文本。在這兩種情況下,圖像本身都沒有標題文本(通常用於工具提示);任何標題文本都取自後面幾行中描述的區域。

第二行開始被分割成各種標記。其中坐標由兩個標記組成,坐標之間用空格隔開。第一個標記是水平(X)位置,從左往右計算;第二個標記是垂直(Y)位置,從上往下計算。所有坐標都是根據全尺寸圖像而不是頁面尺寸圖像來定義的。下面介紹該標籤中的其他參數。

圖像信息

參數名為desc.指定連結到圖像文件描述的藍色「i」圖標的位置,默認值為bottom-right(右下角),可選參數為top-right(右上角) , bottom-left(左下角), top-left(左上角), none(關閉)。對於「thumb」或「frame」圖像,此參數將被忽略。

繪製連結區域

注意:連結區域繪製出現重疊時的,將連結到第一個連結。

  • poly:用給出的坐標繪製一個多邊形區域的連結。
  • rect:用給出的坐標繪製一個矩形區域的連結,由兩個坐標組成:第一個坐標為左上角點,第二個坐標為右下角點。
  • circle:以給出的坐標為圓心,指定半徑繪製一個圓形區域的連結,半徑值在圓心坐標後面。

使用例

美少女花騎士的世界地圖為例:

<imagemap>
File:美少女花騎士世界地圖2.png|744px
poly 136 38 167 23 215 31 193 65 353 177 276 240 313 262 268 296 142 301 85 270 101 152 141 93 [[美少女花騎士:世界地圖#-{風谷の世界花}-「香檸檬谷」-{ベルガモットバレー}-|香檸檬谷]]
poly 372 193 515 182 550 180 594 184 628 161 659 154 730 143 786 135 520 10 245 10 200 67 267 95 [[美少女花騎士:世界地圖#-{雪原の世界花}-「冬之薔薇」-{ウィンターローズ}-|冬之薔薇]]
poly 455 369 542 409 492 474 584 474 571 613 324 607 286 563 327 504 390 469 347 414 391 382 433 363 [[美少女花騎士:世界地圖#-{常夏の世界花}-「香蕉海洋」-{バナナオーシャン}-|香蕉海洋]]
</imagemap>

效果:

香檸檬谷冬之薔薇香蕉海洋美少女花騎士世界地圖2.png
關於該圖像