Help:图像映射

来自伪基百科
Usemane讨论 | 贡献2019年4月29日 (一) 02:21的版本 (导入1个版本)
(差异) ←上一版本 | 最后版本 (差异) | 下一版本→ (差异)
跳到导航 跳到搜索
Bouncywikilogo.gif
为了照顾那些喝太多腥巴克劣质咖啡导致幽默感退化的人们,英文维基百科有一个主题关于:Image map

图像映射能生成可点击的图像,其中不同的坐标区域将链接到不同的条目。例如,可以在世界地图上创建指向每个国家的链接,进一步了解该国的信息。图像映射是令图像的各个部分指向不同链接而不必将图像划分成单独的图像文件的一个简单方法。

范例[编辑]

无注释的简单例子[编辑]

<imagemap>
Image:Example2.png|150px|alt=替代文字
default [[首页|前往首页]]
</imagemap>

<imagemap> Image:Example2.png|150px|alt=替代文字 default 前往首页 </imagemap>

在上面的例子中,无论你点击图片的哪个位置,它始终连接到首页。要了解更多图像信息,点击蓝色“i”图标。它与语法[[Image:Example2.png|150px|alt=替代文字|title=前往首页|link=首页]]的效果相同。

有注释的复杂例子[编辑]

<imagemap>
Image:JoshuaReynoldsParty.jpg|thumb|center|400px|alt=餐厅里有九人围坐一张桌子。晚餐已经结束,一个领头的大个子在高谈阔论,指手划脚,而其他人听得很入神。男子戴着假发,身着18世纪后期的英式服装,家具、装饰和吊灯也是老式的。一个穿着制服的仆人正在走进,手里拿着一个托盘,上面是两个高肩葡萄酒醒酒器。|图像映射范例。点击图片中的人物跳转到相应条目。

poly 133 343 124 287 159 224 189 228 195 291 222 311 209 343 209 354 243 362 292 466 250 463 [[wikipedia:zh:塞缪尔·约翰逊|约翰逊博士 - 词典作家]]
poly 76 224 84 255 43 302 62 400 123 423 121 361 137 344 122 290 111 234 96 225 [[wikipedia:zh:詹姆士·包斯威尔|包斯威尔 - 传记作家]]
poly 190 276 208 240 229 228 247 238 250 258 286 319 282 323 223 323 220 301 200 295 [[wikipedia:zh:约书亚·雷诺兹|约书亚·雷诺兹先生 - 主人]]
poly 308 317 311 270 328 261 316 246 320 228 343 227 357 240 377 274 366 284 352 311 319 324 [[wikipedia:David Garrick|大卫·加里克 - 演员]]
poly 252 406 313 343 341 343 366 280 383 273 372 251 378 222 409 228 414 280 420 292 390 300 374 360 359 437 306 418 313 391 272 415 [[wikipedia:zh:埃德蒙·伯克|埃德蒙·伯克 - 政治家]]
rect 418 220 452 287 [[wikipedia:zh:巴斯夸·帕欧里|巴斯夸·帕欧里 - 科西嘉爱国主义者]]
poly 455 238 484 253 505 303 495 363 501 377 491 443 429 439 423 375 466 352 [[wikipedia:Charles Burney|查尔斯·伯尔尼 - 音乐史学家]]
poly 501 279 546 237 567 239 572 308 560 326 537 316 530 300 502 289 [[wikipedia:Thomas Warton|托马斯·沃顿 - 诗人获奖者]]
poly 572 453 591 446 572 373 603 351 562 325 592 288 573 260 573 248 591 243 615 254 637 280 655 334 705 396 656 419 625 382 609 391 613 453 [[wikipedia:zh:奥立佛·高德史密斯|奥立佛·高德史密斯 - 作家]]
rect 450 86 584 188 [[wikipedia:zh:约书亚·雷诺兹|疑似The Infant Academy,1782年]]
rect 286 87 376 191 [[wikipedia:zh:约书亚·雷诺兹|未知画作]]
circle 100 141 20 [[wikipedia:zh:约书亚·雷诺兹|未知画像]]
poly 503 192 511 176 532 176 534 200 553 219 554 234 541 236 525 261 506 261 511 220 515 215 [[wikipedia:Francis Barber|弗兰西斯·巴贝 - 仆人]]
rect 12 10 702 500 [[wikipedia:The Club (Literary Club)|点击按钮放大或点击链接]]
</imagemap>

<imagemap> Image:JoshuaReynoldsParty.jpg|thumb|center|400px|alt=餐厅里有九人围坐一张桌子。晚餐已经结束,一个领头的大个子在高谈阔论,指手划脚,而其他人听得很入神。男子戴着假发,身着18世纪后期的英式服装,家具、装饰和吊灯也是老式的。一个穿着制服的仆人正在走进,手里拿着一个托盘,上面是两个高肩葡萄酒醒酒器。|图像映射范例。点击图片中的人物跳转到相应条目。

poly 133 343 124 287 159 224 189 228 195 291 222 311 209 343 209 354 243 362 292 466 250 463 约翰逊博士 - 词典作家 poly 76 224 84 255 43 302 62 400 123 423 121 361 137 344 122 290 111 234 96 225 包斯威尔 - 传记作家 poly 190 276 208 240 229 228 247 238 250 258 286 319 282 323 223 323 220 301 200 295 约书亚·雷诺兹先生 - 主人 poly 308 317 311 270 328 261 316 246 320 228 343 227 357 240 377 274 366 284 352 311 319 324 大卫·加里克 - 演员 poly 252 406 313 343 341 343 366 280 383 273 372 251 378 222 409 228 414 280 420 292 390 300 374 360 359 437 306 418 313 391 272 415 埃德蒙·伯克 - 政治家 rect 418 220 452 287 巴斯夸·帕欧里 - 科西嘉爱国主义者 poly 455 238 484 253 505 303 495 363 501 377 491 443 429 439 423 375 466 352 查尔斯·伯尔尼 - 音乐史学家 poly 501 279 546 237 567 239 572 308 560 326 537 316 530 300 502 289 托马斯·沃顿 - 诗人获奖者 poly 572 453 591 446 572 373 603 351 562 325 592 288 573 260 573 248 591 243 615 254 637 280 655 334 705 396 656 419 625 382 609 391 613 453 奥立佛·高德史密斯 - 作家 rect 450 86 584 188 疑似The Infant Academy,1782年 rect 286 87 376 191 未知画作 circle 100 141 20 未知画像 poly 503 192 511 176 532 176 534 200 553 219 554 234 541 236 525 261 506 261 511 220 515 215 弗兰西斯·巴贝 - 仆人 rect 12 10 702 500 点击按钮放大或点击链接 </imagemap>

上面的例子链接到很多不同的页面,取决于你点击的位置。要了解更多图像信息,单击双矩形图标

语法说明[编辑]

一个<imagemap>标记的内容包括空行,注释(以#开头)和逻辑行。第一逻辑行指定要显示的图像。它必须与普通图像的格式相同,除了不含 [[ 和 ]] 。如果第一行的图像指定了 "thumb" 或 "frame" 属性,那么第一行的注释和任何|alt=参数将照常被视为图像注释和替代文字;否则,第一行的|alt=参数(如果不存在的话为任何注释)指定图像的替代文字。在两种情况下图像本身都没有标题文字(通常用于提示文字);任何标题文字是由之后的行所在区域决定。

之后的行分为不同的标记,由空格分隔。每一行的功能是由该行的第一个标记来确定。所有的坐标都是按照图像的原始尺寸,而不是缩略图。它们应表示为距左边缘(水平像素数)、距顶部(垂直像素数)的距离。(注:你可以使用Photoshop画图来对图像进行定位)

desc
指定蓝色“i”图标的位置,连接到图像的说明页。可能的值:top-right, bottom-right (默认), bottom-left, top-left, none。当图像被指定 "thumb" 或 "frame" 属性时此参数被忽略,而是采用通常的双矩形图标
范例:
<imagemap>
Image:PolierMartinWombwellZoffany.jpg|thumb|200px|安东尼·珀丽尔上校
rect 269 140 344 305 [[克劳德·马丁]]
rect 124 147 181 298 [[安东尼·珀丽尔|安东尼-路易·珀丽尔]]
desc none
</imagemap>
poly
多边形。指定顶点的坐标,之后是带方括号的链接。
rect
矩形。参数为左上和右下角,之后是带方括号的链接。
circle
圆。前两个参数是圆心坐标,第三个是半径。之后是带方括号的链接。
default
为没有被指定的区域设置默认链接。

所有坐标都相对于原图像指定。该图像可以用缩略图的语法进行缩放,在这种情况下图像映射的坐标也将被自动缩放。

各链接都是以[[页面标题]]或[[页面标题|描述]]的形式给出。在后一种情况下,管道符“|”之后的部分成为链接的标题属性——在大多数浏览器中,当鼠标悬停它会作为提示文字弹出;管道符后面的部分也成为链接的替代文字。如果没有给出明确的链接描述,将使用页面标题。

在重叠的区域中先列出的链接优先级高。

包含模板、魔术字或解析器函数的用法[编辑]

如果你想要用这个扩展(和其他大多数标记扩展一样)解析模板参数、魔术字或解析器函数,你将需要使用#tag 语法,例如Template:Click。在这种情况下,竖线|必须用{{!}}模板替代(当它们出现在链接或参数中除外)。

范例 - 标准格式
<imagemap>
Image:ExamplePlant80.png|60px|ExamplePlant
rect 0 107 294 260 [[Plants/ExamplePlant|ExamplePlant]]
desc none
</imagemap>
范例 - 使用 {{PAGENAME}} 变量
{{#tag:imagemap|
Image:ExamplePlant80.png{{!}}60px{{!}}ExamplePlant
rect 0 107 294 260 [[{{PAGENAME}}/ExamplePlant|ExamplePlant]]
desc none
}}

参见[编辑]