With this Plugin for [JSPWiki|http://www.jspwiki.org] you can use [Image Maps|Google:Image Map Tutorial] on your pages in a very easy way. The plugin can be used the same way like the normal [ImagePlugin|JSPWiki:Image]. The map points and links can be edited by a simple web based wizard, or you can type the map points in the plugin text.

If you click on the edit-link at the right bottom corner of the picture, you will jump to the image map wizard, just try it.

!Example

[{ImageMap image='deutschland.png'

NordrheinWestfalen;50;170;20
http://www.berlin.de;217;115;20
http://www.bayern.de;165;273;20
http://www.hessen.de;91;204;20
Test;107;103;20>>
<<Oslo;83;294;20 Bochum;61;70;20>>
<<www.google.com;95;106;20 [Dortmund|CityDortmund];152;196;20>>
<<xxx;112;101;20 CityDortmund;173;152;20>>
<<yyy;172;153;20 ddd;110;40;20>>
<<ggg;170;131;20 luk;203;58;20>>
<<ccc;151;196;20 kanala;157;269;20>>
<<2;158;156;20 test;84;58;20>>
<<perak;179;92;20 CityDortumund;95;295;20>>
<<;0;0;20 http://www.google.com;230;133;20>>
<<aaa;0;0;20 ;169;270;20>>
<<GoHere;169;137;20 CityDortmund;110;107;20>>
<<www.bb.com.br;100;98;20 ;174;146;20>>
<<www.bb.com.br;107;101;20 ;105;105;20>>
<<Sachsen;215;183;20 test;110;30;20>>
<<Sachsen 2;214;182;20 [Dortmund|CityDortmund];226;141;20>>
<<SACHSEN;221;180;20 ;112;41;20>>
<<333;0;0;20 NoMan;107;45;20>>
<<;221;141;20 Lord;166;200;20>>
<<mylink;118;49;20 ;142;192;20>>
<<Westfalen;45;169;20 dfsdf;84;88;20>>
<<;171;274;20 ;101;147;20>>
<<ZeittafelBarsaives;142;196;20 Sachsen;219;183;20>>
<<ZeittafelBarsaives;171;142;20 Sachsen;219;183;20>>
<<;0;0;20 [abc];180;61;20>>
<<;217;115;20 ;86;188;20>>
<<Dortmund;101;102;20 test;59;96;20>>
<<Test42;177;298;20 test;36;292;20>>
<<[Dortmund|CityDortmund] ;175;278;20 well;220;140;20>>
<<;151;253;20 julie;54;42;20>>
<<;247;323;20 test;177;61;20>>
<<Test;166;277;20 http://www.google.com;30;262;20>>
<<;63;104;20 nomads;232;224;20>>
<<test;217;185;20 CityDortmund;121;56;20>>
<<hello;22;329;20 [TestMe];64;99;20>>
<<CityDortmund;62;152;20 dsds;115;39;20>>
<<cool place;88;310;20 sds;106;106;20>>
<<name;109;122;20 testcity;233;142;20>>
<<dfgdfgfdgdsfs;87;93;20 ;171;270;20>>
<<foo;112;37;20 http://www,google.de;49;42;20>>
<<aap;147;197;20 http://www.google.de;195;9;20>>
<<CityDortmund;108;106;20 yyy;174;274;20>>
<<Aus;11;161;20 yyy;46;59;20>>
<<FGGF;191;60;20 kl;198;310;20>>
<<;43;65;20 tt;41;47;20>>
<<a;172;287;20 taylor;200;3;20>>
<<werner;115;124;20 cc;159;108;20>>
<<CityDortmund;163;140;20 ;184;120;20>>
<<one;107;115;20 ;97;96;20>>
<<testre;34;40;20 Hong;169;287;20>>
<<help;218;352;20 ;73;102;20>>
<<help;218;352;20 www.bart.nl;108;104;20>>
<<Dortmund;220;112;20 http://ns.nl/cs/Satellite/ns2007/nl/hoofdmenu/include/1160724828566/reizigers?p=1160724828566;123;46;20>>
<<CityDortmund;0;0;20 test;127;52;20>>
<<[Test|http://www.jspwiki.org/wiki/ImageMapPlugin];61;331;20 Hong;163;270;20>>
<<[Dortmund|CityDortmund];227;141;20 http://www.berlin.de;217;115;20;52;244;20>>
<<bayern;172;285;20 CityDortmund;28;293;20>>
<<kaushal;238;237;20 CityDortmund;169;274;20>>
<<as;204;123;20 http://www.orf.at;252;31;20>>
<<fdfs;183;181;20 http://jspwiki.org;134;358;20>>
<<cccc;87;93;20 CityDortmund ;107;99;20>>
<<;186;61;20 http://google.com?q=new;144;137;20>>
<<http://google.es;150;248;20 ;104;108;20>>
<<CityDortmund sdfsf;43;42;20
AAA;149;85;20
http://www.google.es;12;13;20
;155;52;20
;91;14;20
BishBish;99;114;20
www.cnn.com;180;275;20
;45;170;20
asdfadsffsdaff;113;110;20
bw_ul;47;346;20
schwäbisch <<;214;29;20 hall|SHA;110;279;20
}]

is created by the following plugin definition:

{{{
[{ImageMap image='deutschland.gif'

NordrheinWestfalen;50;170;20
http://www.berlin.de;217;115;20
http://www.bayern.de;165;273;20
http://www.hessen.de;91;204;20
}]
}}}

!ImageMap-Plugin-Parameters
|| Name || Description || Necessity
| image | URL or attachment name of the image | required
| align | center, left, right | optional (none)
| width | size of the image | optional
| height |size of the image | optional

It is important that the plugin text has a body part, that is the text after the blank line under the {{ImageMap}} definition. Here the wizard stores the link and point parameters in the form {{link;x;y;r}}. So an empty ImageMap must have a blank line before the closing brakets.

By default a circle with radius r is used. Link can be any wiki link. You can specify other shapes like {{link;polygon;x1;y1;x2;y2;...;xn;yn;}} or {{link;rect;x1;y1;x2;y2;}} but at the moment the wizard just creates circle shapes with radius 20. Other shapes are working but must be edited by hand in the page text for the time beeing.

!Installation

1. The following jars must be copied to {JSPWiki}/WEB-INF/lib:

* [SBaltesPlugins.jar|SBaltesPlugins/SBaltesPlugins.jar]

2. The following must be added to {JSPWiki}/WEB-INF/web.xml:

{{{
<servlet>
<servlet-name>ImageMapServlet</servlet-name>
<servlet-class>
com.ecyrd.jspwiki.plugin.ImageMapServlet
</servlet-class>
</servlet>

<servlet-mapping>
<servlet-name>ImageMapServlet</servlet-name>
<url-pattern>/ImageMapServlet</url-pattern>
</servlet-mapping>
}}}

!Known Bugs

* The __Referenced By__ tag does not recognize ImageMap links.
* The old plugin syntax {{{[{INSERT .... WITH param}]}}} is not supported by the wizard.

!Source Code

The source code is part of the SBaltesPlugins.jar.

!License

ImageMapPlugin a JspWiki Plugin for using html image maps.
Copyright (C) 2004 Sebastian Baltes

This library is free software; you can redistribute it and/or
modify it under the terms of the GNU Lesser General Public
License as published by the Free Software Foundation; either
version 2.1 of the License, or (at your option) any later version.

This library is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
Lesser General Public License for more details.

[GNU LESSER GENERAL PUBLIC LICENSE Version 2.1|http://www.gnu.org/copyleft/lesser.txt]