Summary: Talk page for ImageMap.
Users: +2 (View / Edit)

This space is for User-contributed commentary and notes. Please include your name and a date along with your comment.


I just applied this recipe to two imagemaps in my wiki which previously were HTML attachments to wiki pages, and after a smooth conversion I'm very happy with the results. Thank you, HansB! :-) --Henning February 23, 2006, at 11:40 AM

Hi HansB, one of my collegues was wanting to link within a page using an imagemap, but the current code places a '#' and not the tag for a link within a page. I played with the php code and replaced:

//          preg_match("/(#)(.*?)/e",$tgt,$m);  ## old - pre hack
//          if($m[1]) $LinkUrl = '#';           ## old - pre hack     


        if (preg_match("/^#/",$tgt)) {      # special hack for Aya
          $LinkUrl = $tgt;                  # special hack for Aya
        }                                   # special hack for Aya

@] This works for me, but you may wish to solve it another way, of course...

I add some code for link to a email (beginning with mailto: , it seems to work for me !

        if($m[1]) $LinkUrl = $tgt;

After successfully using this recipe for years, visitors recently told me that Firefox has some issues with some of the links on the imagemaps. I checked how the imagemap page source validated with and found the following issues:

  1. no id attribute for the <map ...> tag
  2. no "alt" attribute specified for the <area ..> tags
  3. image map ends prematurely due my use of empty lines for formatting within the <map ...></map>

Here is a direct link for validating this page (mine is in an intranet not accessible from the outside): Validate this cookbook page

I still have to look up what the id attribute is good for, added alt attributes manually (or rather re-dedicated the title attribute I had used previously), and eliminated the empty lines manually.

Maybe it might be a good idea to generate an id attribute automatically (if possible at all), and generate a generic alt attribute (like "imagemap element") automatically as well. I've already added a warning against the use of empty lines within the area list under "notes" above so users of this recipe are made aware of this easily-avoided trap. --Henning October 17, 2008, at 11:17 AM

Style Attribute Support

Hi, I added following code to the MapArea-function allowing one to set a style. --Martin November 08, 2006, at 23:57 PM

   if (isset($arg['style']))
        $out .= " style='".$arg['style']."'";

Relative Page Names

I've modified the href code a bit to allow for relative pagename links. For example, if the current page is House.Kitchen, href=Bathroom resolves to House.Bathroom. Additionally, I tightened up the RegExs. Here's the patch against version 2006-10-28: imagemap.php-relative_href_patch.txtΔ --DanZD November 13, 2006, at 14:49 PST

Is there a possibility to use the parameter target='_blank' to open a new window for the linked (external) page? Johnny, June 24, 2010

Good question, I tried the following two markups without success - simon June 24, 2010, at 10:39 PM
%usemap=#infostore%Attach:infostore-access_8.gif"Information Store components"%%


%newwin usemap=#infostore%Attach:infostore-access_8.gif"Information Store components"%%

So, I added it to the php-file (it was easier then expected :-) ): imagemap_with_target.phpΔ. Rename the file and use the target='_blank' in the (:area :) markup. Johnny, June 28, 2010

Talk page for the ImageMap recipe (users).