DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:image_map
no way to compare when less than two revisions

Differences

This shows you the differences between two versions of the page.


Previous revision
Next revision
plugin:image_map [2010-01-22 23:24] Klap-in
Line 1: Line 1:
 +====== Image Map plugin ======
 +
 +---- plugin ----
 +description: Create client-side image maps
 +author     : Tom Harris
 +email      : tnharris@whoopdedo.org
 +type       : syntax
 +lastupdate : 2009-05-05
 +compatible : 2007-06-26
 +depends    : 
 +conflicts 
 +similar    : 
 +tags       : media, images, links
 +
 +downloadurl: http://whoopdedo.org/doku-plugins/imagemap.zip
 +bugtracker : 
 +sourcerepo : 
 +donationurl: 
 +
 +----
 +
 +An image map is a graphical object where portions of the image act  as links. With this plugin, you can not only create an image map, but also an alternate representation that can be used by non-visual browsers. [[http://whoopdedo.org/doku/wiki#image_map|Details]].
 +
 +===== Installation =====
 +
 +Download using the plugin manager the given URL above, or manually and unzip in your ''plugins'' folder 
 +
 +==== Changes ====
 +
 +  * 2009-05-05 - An error in the handling of custom sizes prevented the plugin from working.
 +
 +===== Syntax =====
 +
 +<code>
 +{{map>media_link|Alternate Text}}
 +
 +Type normal wiki markup here. Links will be automatically detected and used in the image map.
 +
 +  * [[wikipage|Description @ 10,12,40,30]]
 +  * [[wp>image_map|An interwiki link @ 110,50,40]]
 +  * [[http://w3.org/|{{w3c_logo.png|Even image links work @10,115,80,95,150,115,80,135}}]]
 +{{<map}}
 +</code>
 +
 +This example will display the image ''media_link''. (if the browser is capable of it.) There will be three links in the image:
 +
 +  * A link to the wiki page ''wikipage'' in a rectangle.
 +  * An interwiki link in a circle.
 +  * An external link in a polygon. The link is defined with an image, so the alternate text of the image is used for the map.
 +
 +For a link to be used in the map, it must define the shape as part of the link text. This is done with the ''@'' character followed by a list of coordinates. The number of coordinates determines the shape of the link.
 +
 +^  #  ^   shape   ^ coordinates               |
 +|  3  | circle    | center-x,center-y,radius  |
 +|  4  | rectangle | left,top,right,bottom     |
 +|  6+ | polygon   | x1,y1,x2,y2,x3,y3...      |
 +
 +If the label does not contain a suitable shape description, then that link will be ignored for the map. The coordinates will be removed from the link tag, in both the image map and the alternate markup.
 +
 +The wiki markup inside the map block will be generated by not displayed in most browsers. If using an image map is not desirable, however, the browser can hide the image and display the alternate markup. The plugin is already configured to do the ''braille'', ''aural'', and ''tty'' CSS media types.
 +
 +Note: Be sure to include the leading colon when defining the image <code>{{map>:media_link|Alternate Text}}</code> to avoid unexpected behavior particularly when using namespaces.
 +
  

Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
CC Attribution-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki