OASIS Mailing List ArchivesView the OASIS mailing list archive below
or browse/search using MarkMail.


Help: OASIS Mailing Lists Help | MarkMail Help

docbook-apps message

[Date Prev] | [Thread Prev] | [Thread Next] | [Date Next] -- [Date Index] | [Thread Index] | [List Home]

Subject: Re: [docbook-apps] imagedata as olink anchors

 > Regarding image maps, there is no support in the DocBook
 > stylesheets for them.  Perhaps someone has written a
 > customization that can do that.

I implemented a client-side image map. An example is in my  Website 
project at http://www.ivanmoravec.net/schedule/schedule.html. On the 
image side I customized two templates in docbook/html/graphics.xsl. The 
map side then just required a few simple new templates. Source markup is 
pretty straightforward.

FWIW, here's how it works:

Sample page source markup:
       <imageobject>          <!-- image to be mapped -->
         <?usemap mymap?>     <!-- PI to specify the map name  -->
         <imagedata depth="134px" fileref="../images/bigworld.gif" 

<!-- Section for map. label must match name in usemap PI. -->
   <section label="mymap" role="imagemap">
     <title role="ignore"></title>
     <para role="area">
        <phrase role="shape">CIRCLE</phrase>
        <phrase role="coords">401,53,4</phrase>
        <phrase role="href">#apr29.2004gig</phrase>
        <phrase role="alt">Prague 29.4.2004</phrase>
     <para role="area">
        <phrase role="shape">CIRCLE</phrase>

XSL customizations (with a little context):
1. <xsl:template name="process.image">
         <xsl:param name="mapname"/>      <!-- imagemap customization -->
         <xsl:if test="@align">
             <xsl:attribute name="align">
                 <xsl:when test="@align = 'center'">middle</xsl:when>
                   <xsl:value-of select="@align"/>

      <!-- imagemap customization -->
           <xsl:if test="$mapname">
             <xsl:attribute name="usemap">
               <xsl:text>#</xsl:text><xsl:value-of select="$mapname"/>
      <!-- end imagemap customization -->

2. <xsl:template match="imagedata">
       <xsl:call-template name="process.image">

<!--  imagemap customization -->
         <xsl:with-param name="mapname">
<!-- end imagemap customization  -->

3. New templates:

<xsl:template match="section[@role='imagemap']">
     <xsl:attribute name="name">
       <xsl:value-of select="./@label"/>

<xsl:template match="para[@role='area']">
     <xsl:attribute name="shape">
       <xsl:value-of select="phrase[@role='shape']"/>

     <xsl:attribute name="coords">
       <xsl:value-of select="phrase[@role='coords']"/>

     <xsl:attribute name="href">
       <xsl:value-of select="phrase[@role='href']"/>

     <xsl:attribute name="alt">
       <xsl:value-of select="phrase[@role='alt']"/>

[Date Prev] | [Thread Prev] | [Thread Next] | [Date Next] -- [Date Index] | [Thread Index] | [List Home]